如何获得相同的高度到两个兄弟按钮

Question

我在<button>元素中有两个<div>个元素。其他按钮有很多文本被分成两行或更多行，而另一行有一个小文本（一行）。如何为两个按钮提供相同的高度？

我并没有尝试获得基于Javascript或jQuery等的答案，而是基于css的简洁答案，而且我并没有尝试动画或操纵这些元素。

Answer 1

根据我的评论小提示，您可以将按钮显示属性应用于table-cell并实现相同的目标。

<强> HTML

 <div class="test">
    <button>small text</button>
    <button>this is big text and will go to new line</button>
 </div>

CSS

 .test{display:table;}
 button{width:90px; height:110%; margin:0px 10px; vertical-align:top; display:table-cell;}

DEMO

Answer 2

您可以调整顶部和底部的填充。 访问http://www.w3schools.com/css/css_padding.asp