具有相同高度和垂直居中文本的 Bootstrap 按钮

Question

我有 3 个并排的 Bootstrap 按钮，但其中一个有换行符（我正在用 修改它们white-space: normal）。我需要它们都具有相同的高度和垂直居中的文本。

我有这样的：

我需要他们这样：

我无法弄清楚如何做到这一点。有任何想法吗？

Answer 1

这样的东西对你有用吗？

.option-button {
    height:100%;
}

.media-object {
    height: 100px;
}

<br/><br/>
<div class="media-object pull-left">
    <button class="btn btn-info option-button">A</button>
    <button class="btn btn-primary option-button">A<br/>B<br/>C</button>
    <button class="btn btn-info option-button">A</button>
</div>            

<link rel="stylesheet" type="text/css" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">

<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/js/bootstrap.min.js"></script>

您可以在按钮上使用height: 100%;，但是您需要设置包含的 div 的高度。希望这可以帮助！