如何在表格单元格内垂直对齐div？

Question

如何垂直居中表格单元格内的div？

HTML:

<tr class="rowClass">
    <td class="cellClass">
        <div class="divClass">Stuff</div>
    </td>
</tr>

CSS:

.rowClass {
    vertical-align:middle !important;
    height:90px;
}

.cellClass {
    vertical-align:middle !important;
    height:90px;
}

.divClass {
    vertical-align:middle !important;
    height:90px;
}

我知道类定义是多余的,但我一直在尝试很多不同的东西.为什么解决方案(不管是什么)不直观.我试过的"明显"解决方案都没有用.

Answer 1

无需height在.divClass中定义.像这样写:

.cellClass {
    vertical-align:middle;
    height:90px;
    border:1px solid red;
}

检查这个http://jsfiddle.net/ncrKH/