在 Bootstrap 3 中对齐中间 2 个元素？答案

【问题标题】：Align middle 2 elements in Boostrap 3?在 Bootstrap 3 中对齐中间 2 个元素？
【发布时间】：2014-01-04 02:56:58
【问题描述】：

这就是我想用 BS3 做的事情：

这是我的起始代码：

<div class="container">
    <div class="row">
        <div class="col-md-12">
            <div class="well well-sm">
                <i class="glyphicon glyphicon-th-large pull-left"></i>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Atque molestias nihil quia!</p>
            </div>
        </div>
    </div>
</div>

JsFiddle 网址 - http://jsfiddle.net/AJAhR/54/

我尝试使用 line-height，但它必须是响应式的，所以它不起作用。

谁能解释我如何使用 CSS/Boostrap3 来做到这一点。

【问题讨论】：

标签： css twitter-bootstrap-3

【解决方案1】：

尝试绝对位置

 .well.well-sm p { margin-left: 60px; /* with of the icons + icon's padding right */ }
 .well.well-sm { position: relative; }
 .well.well-sm i { position: absolute; top: 50%; left: 0; margin-top: -50px; /* 50% of the icon's height */ }

直播：http://jsfiddle.net/AJAhR/55/

【讨论】：

谢谢！我只是将 margin-bottom: 0 添加到 p 元素，它是完美的。