html - 垂直对齐表格单元格中的多个对象

Question

这是 jsFiddle . 如何在不使用绝对值(即 px)的情况下，将 img 和 div 垂直居中放置在 td 中？

纯 CSS 解决方案值得赞赏。谢谢。

Answer 1

像这样？

http://jsfiddle.net/Mgwzx/10/

<div style="width:100%; height:60px; position:relative; overflow:visible;">
    <table style="width:400px; table-layout:fixed" cellspacing="0" cellpadding="0">
        <tr>
            <td style="vertical-align: middle; width:200px;">
                <img align="left" src="http://upload.wikimedia.org/wikipedia/donate/c/c0/Information-icon.png" style="float:left;margin-top:50px;" />
                <div style="text-align:center; float:left; width:150px;">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat</div>
            </td>
        </tr>
    </table>
</div>