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>

Answer 2

您可以尝试以下几种方法：

确保您使用reset.css样式表重置所有浏览器默认值并适应任何浏览器怪癖。这对于Internet Explorer来说尤其重要。
仅对表格数据使用表格 - 我不确定表格的其余部分是什么，但除非有数据行，否则使用div容器会更容易{ {1}}和p浮动。
在img。
使用CSS img查看它是否有助于悬停时的定位问题。我看到悬停问题与jQuery脚本和CSS3 PIE等浏览器黑客有很多关系 - 如果你正在使用它们，请尝试删除它们。

Answer 3

尝试在元素上设置style="zoom:1"。

Answer 4

我不确定但是看着

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

从我可以看到的是没有表格宽度，因此IE不知道如何适当地缩放td。

另一个猜测是因为你在第一个IE上解释宽度为100％，将其推迟。我的猜测是，你不能在第一个单元格上有100％的宽度，因为它意味着占据整个表格宽度的100％。

Answer 5

清除浏览器缓存，在图片

上指定宽度和高度

我已经看到了ie7上最奇怪的东西，比如分页符\ n等导致这种效果，即：

<a href="#>
<img src="jpg" />
</a>

修复只是将所有内容放在同一行并且没有空格（如右边有空格的表格）

也避免使用内联样式，使用样式表（css）

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

5 个答案: