在调整大小屏幕时保持两个按钮的大小相同

Question

我正在使用引导程序，并且我的按钮大小有问题。 当我调整我的屏幕（浏览器）时，显然按钮的大小会改变，但不是统一的。

是否有简单的方法来保持相同的尺寸，即它们同时变大（相同的高度）？或任何其他好的做法是值得欢迎的..

这里是小提琴https://jsfiddle.net/udr63mqt/

HTML：

<div class="container" style="max-width:1360px"> 
     <div class="col-sm-6"> 
      <button class="btn-block btn-lg alert-info" id="button_add_info"> 
       <span class="btn-image glyphicon glyphicon-pencil push-left"></span> 
       <span>Lorem ipsum dolor sit amet, consectetur.<small> Quibusdam, magni, doloribus.</small></span> 
      </button> 
     </div> 
     <div class="col-sm-6"> 
      <button class="btn-block btn-lg alert-info" id="button_add_info"> 
       <span class="btn-image glyphicon glyphicon-pencil"></span> 
       <span>Lorem ipsum dolor sit amet, consectetur adipisicing elit?<small> Quibusdam, magni, doloribus, possimus eum sapiente.</small></span> 
      </button> 
     </div> 
    </div> 

CSS：

#button_add_info { 
background-color:lavender; 
border-radius: 0px; 
text-shadow:none; 
border:none; 
box-shadow:none;} 

非常感谢！

Answer 1

您的意思是这样的？

https://jsfiddle.net/gratiafide/wyt8uy0k/

此选项将是一个高度和宽度设置为你的CSS的按钮，使他们停止在任何你喜欢的宽度调整。这样做将覆盖默认的引导高度和宽度值：

@media (min-width: 768px) { 
    #button_add_info { 
     background-color:lavender; 
     border-radius: 0px; 
     text-shadow:none; 
     border:none; 
     box-shadow:none; 
     height:300px; 
     width:250px; 
    } 
} 

#button_add_info { 
     background-color:lavender; 
     border-radius: 0px; 
     text-shadow:none; 
     border:none; 
     box-shadow:none; 
     height:200px; 
     width:150px; 
    }