как выровнять div по вертикали внутри ячейки таблицы?

<p>как я могу вертикально центрировать div, который находится внутри ячейки таблицы?</p><p>html:</p><pre><code><tr class="rowclass"> <td class="cellclass"> <div class="divclass">stuff</div> </td> </tr> </code></pre><p>css:</p><pre><code>.rowclass { vertical-align:middle !important; height:90px; } .cellclass { vertical-align:middle !important; height:90px; } .divclass { vertical-align:middle !important; height:90px; } </code></pre><p>я знаю, что определения классов избыточны, но я пробовал много разных вещей. почему решение (каким бы оно ни было) не является интуитивно понятным. ни одно из "очевидных" решений, которые я попробовал, не сработало.</p>

<p>нет необходимости определять <code>height</code> в <strong>.divclass</strong>. напишите так:</p><pre><code>.cellclass { vertical-align:middle; height:90px; border:1px solid red; } </code></pre><p>проверьте это <a href="http://jsfiddle.net/ncrkh/">http://jsfiddle.net/ncrkh/</a> </p>

<p>лучший учебник, который я когда-либо нашел по этому вопросу: <a href="http://phrogz.net/css/vertical-align/index.html">как вертикально отцентрировать материал</a> </p>

<p>с помощью любого css вы можете сделать это с помощью <code>valign="middle"</code> попробуйте этот код.</p><pre><code><table width="100%" border="1" cellspacing="0" cellpadding="0"> <tr> <th height="550" align="center" valign="middle" scope="col"> <div>hello</div> </th> </tr> </table> </code></pre>

<p><code>.divclass { margin-top:auto; }</code></p><p><strong>html</strong></p><pre><code><table border=1> <tr class="rowclass"> <td class="cellclass"> <div class="divclass">stuff</div> </td> </tr> </table> </code></pre><p><strong>css</strong></p><pre><code>.rowclass { vertical-align:middle !important; height:90px; } .cellclass { vertical-align:middle !important; height:90px; } .divclass { margin-top:auto; } </code></pre><p> <a href="http://jsfiddle.net/p3qvt/1/">живой пример</a> </p>