css - 用于电子邮件签名的表格中的文本与图像垂直对齐？

Question

我正在使用 CSS 创建电子邮件签名，但在将文本垂直对齐到简单图像旁边时遇到了问题。

我试过 valign 和 Vetical-align，但都没有奏效。
谁能帮忙？

我现在对代码中的内容进行了快速综述。

http://jsfiddle.net/J5LTw/1/

或者只是在代码中:

<table style="width:500px; font-family:century gothic; font-size:10">
<tr><td><p style="color: #184d95; font-weight:bold">Company</p></td></tr>
<tr><td><img src="http://i42.tinypic.com/xauvbp/5.jpg" border="0" width="20" height="20"> Phone</td></tr>
<tr><td><img src="http://i44.tinypic.com/2d2f6kx.jpg" border="0" width="20" height="20"><a href="mailto:info@mail.nl" style="color:black; text-decoration:none">Mail</a></td></tr>
<tr><td><img src="http://i41.tinypic.com/2j4ebg5.jpg" border="0" width="20" height="20"> <a href="http://site.nl" style="color:black; text-decoration:none">Site</a></td></tr>
</table>

谢谢!

Answer 1

试试这个

http://jsfiddle.net/J5LTw/2/

如果您 MAKE CLASS请使用这个css

table tr img{
    height:20px;
    vertical-align:middle;
}

如果你写 INLINE CSS请使用

http://jsfiddle.net/J5LTw/3/

<table style="width:500px; font-family:century gothic; font-size:10">
<tr><td><p style="color: #184d95; font-weight:bold">Company</p></td></tr>
<tr><td><img src="http://i42.tinypic.com/xauvbp/5.jpg" border="0" width="20" height="20" style="vertical-align:middle;"> Phone</td></tr>
<tr><td><img src="http://i44.tinypic.com/2d2f6kx.jpg" border="0" width="20" height="20"  style="vertical-align:middle;"> <a href="mailto:info@mail.nl" style="color:black; text-decoration:none">Mail</a></td></tr>
<tr><td><img src="http://i41.tinypic.com/2j4ebg5.jpg" border="0" width="20" height="20"  style="vertical-align:middle;"> <a href="http://mennescreative.nl" style="color:black; text-decoration:none">Site</a></td></tr>
</table>