css - 为什么 IE7 会在鼠标悬停时移动 DOM 元素？

Question

所以我有一个只有两列和一行的表格。第二个 td 保存图像，第一个保存文本。我希望包含该图像的 td 尽可能小，并且第一个 td 填充剩余空间。以下适用于除 IE7 之外的所有浏览器(我们不使用 IE6):

<table> <tr><td style="width:100%;">TEXT</td><td><img src="jpg" alt="jpg" /></td></tr> </table>

发生的事情是这样的:页面正确呈现，然后当您将鼠标悬停在表格上时，第一个 td 会扩展以填满整个表格，将图像推离边缘。

我可以用一些 jQuery 来解决这个问题，以测量图像的宽度并计算第一个 td 的余数；但是那个解决方案充满了 LAME!

请帮忙。我不明白为什么 IE7 觉得需要重绘它的方式。

Answer 1

请尝试使用以下代码。与其显式声明太多宽度，不如尝试显式声明太小(因为图像无论如何都会将宽度推到超过 1%。)

我是在没有真正查看 IE7 的情况下写下这篇文章的，但是我在家里的虚拟机中安装了 IE7，所以如果我找到不同的解决方案，我会稍后回复。

<table style="width: 100%;" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>TEXT</td>
<td width="1%" style="width: 1%;"><img src="http://www.google.com/intl/en_com/images/srpr/logo2w.png" alt="Google Logo" /></td>
</tr>
</table>