使用Bootstrap垂直对齐文本

Question

在这里尝试解决方案： vertical-align with Bootstrap 3 和这里： vertical-align: middle with Bootstrap 2 没有工作。

这是页面： http://yonicks.com/falican/exemple.htm

代码：

<div class="container">
    <div class="row gray_back">
         <div class="col-md-6 content_area  vcenter ">

             <div class="col-md-2"></div>

             <div class="col-md-10 vcenter">
                 <h1 >text here need to be in the middle vertically</h1>
                 <h1 > also this</h1>
             </div>


             <div class="the_p_area">
                 <div class="col-md-2"> </div>

                  <div class="col-md-10">
                      also this also this also this also this also this also this also this also this

                  </div>

             </div>

         </div>


         <div class="col-md-6">
             <img src="img/fff.png" class="img-responsive" alt="Responsive image">
                        <br>
         </div>

    </div>

</div>

我使用的是最新版本的Bootstrap。

如何使文本垂直对齐？

Answer 1

你很亲密。

.row > .col-md-6 {
    display: table-cell;
    float: none;
    vertical-align: middle;
}

Answer 2

你可以用！行高。垂直对齐属性非常具体

例如：

.yourclas{
 line-height: 2;
}