vertical-align:middle在twitter bootstrap中没有表行rowpan

Question

我正在使用Twitter Bootstrap 3.x,我有一个表格,其中一个单元格的行数为"2".这是表格行:

<tr>
    <td rowspan="2" class="critical">
        <a href="#"><span class="glyphicon glyphicon-check white"></span></a>
    </td>
    <td colspan="2" class="col-xs-8 col-md-10">
        <b><a href="#">Title</a></b>
    </td>
</tr>
<tr>
    <td class="col-xs-8 col-md-10">
        <em><small>12/07/2014</small></em> - <a><span class="glyphicon glyphicon-paperclip"></span></a></small>
    </td>
    <td class="col-xs-4 col-md-2">
        <em><small  class="pull-right"><a href="#" class="black">Some name</a></small></em>
    </td>
</tr>

我一直在寻找StackOverflow这些解决方案:

• 使用Bootstrap 3 vert-align类(我在文档中找不到但有人说它已添加)
• 请改用line-height
• 添加CSS vertical-align:middle
• 垂直对齐:基线
• .........

我已经尝试了一切,并且看着Chrome开发控制台,每当我添加行高或垂直对齐:中间时,它会出现描边并且不会应用.也试过!重要,但也没有工作.

我想知道是否存在阻止rowspan单元格在中间对齐的东西,如果它是由于rowspan(这是最可能的问题,因为该示例的人在JSFiddle中提供vertical-align:middle就像魅力一样) .

如果需要任何额外数据,请更新线程.提前致谢!

Answer 1

Bootstrap使用选择器(缩短):

.table>tbody>tr>td {
    vertical-align: top;
}

所以它的单一选择器(.vertical-center)具有更高的优先级.所以使用更具体的选择器或!important

.vertical-center {
    vertical-align: middle !important;
}