为什么 IE7 会在鼠标悬停时移动 DOM 元素？
所以我有一个只有两列和一行的表。第二个 td 保存图像，第一个 td 保存文本。我希望包含图像的 td 尽可能具有该图像内部的最小尺寸，并且第一个 td 填充剩余空间。以下内容适用于除 IE7 之外的所有浏览器（我们不使用 IE6）：
; < /tr>文本
发生的情况是这样的： 页面渲染正确，然后当您将鼠标悬停在表格上时，第一个 td 会展开以填充整个表格，将图像推离边缘。
我可以用一些 jQuery 来解决这个问题，以测量图像的宽度并计算第一个 td 的余数；但这个解决方案充满了蹩脚！
请帮忙。我不明白为什么 IE7 觉得需要重绘它的方式。
So I have a table with only two columns and one row. The second td holds an image, and the first holds text. I would like the td containing the image to be at the minimum size possible with that image inside, and the first td to fill the remaining space. The following works in every browser except IE7 (we are not doing IE6):
<table> <tr><td style="width:100%;">TEXT</td><td><img src="jpg" alt="jpg" /></td></tr> </table>
What happens is this:
The page renders correctly, then when you mouse over the table, the first td expands to fill the entire table, pushing the image off the edge.
I could fix this with some jQuery to measure the width of the image and calculate remainder for the first td; but that solution is full of LAME!
Please help. I do not understand why IE7 feels the need to redraw the way it does.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（5）
请尝试使用以下代码。不要显式地声明太多宽度，而是尝试显式地声明太少（因为无论如何图像都会将宽度推到 1% 以上。
）家里的虚拟机，所以如果我找到不同的解决方案，我稍后会发表评论。
Try the following code instead. Instead of explicitly declaring too much width, try explicitly declaring too little (because the image will push the width beyond 1% anyway.)
I am writing this off the top of my head without actually having looked in IE7, but I have IE7 in a Virtual Machine at home and so I'll comment back later if I find a different solution.
您可以尝试以下几项操作：
div的容器会更容易code>p 和img浮动。img的宽度和高度。position:relative; float: left;看看它是否有助于解决悬停时的定位问题。我经常看到 jQuery 脚本和 CSS3 PIE 等浏览器黑客的悬停问题 - 如果您正在使用这些，请尝试删除它们。There are a couple of things that you could try:
divwith apandimgfloated.img.position: relative; float: left;to see if it helps with positioning issues on hover. I see hover issues a lot with jQuery scripts and browser hacks like CSS3 PIE — if you're using those, try removing them.尝试在元素上设置
style="zoom:1"。Try setting the
style="zoom:1"on the element.我不确定，但从
我所看到的来看，这上面没有表格宽度，所以 IE 不知道如何适当地缩放 td。
另一种猜测是因为您在第一个上将宽度声明为 100%，IE 会将其解释为将其推开。我的猜测是，第一个单元格的宽度不能为 100%，因为这意味着占用整个表格宽度的 100%。
I am not sure but looking at
from what I can see is that there is no table width on this, so IE does not know how to scale the td appropriately.
Another guess is because you're are declaring width as 100% on the first one IE interprets this to shove it off. Which is my guess, you can not have a width of 100% on the first cell because it means to take up 100% of the full table width.
清除浏览器缓存，在图像上指定宽度和高度
我在 ie7 上看到了最奇怪的东西，例如分页符 \n 等导致此效果的原因，即：
修复只需将所有内容放在同一位置即可行且不带空格（就像右侧有空格的表格）
也避免使用内联样式，使用样式表（css）
clear you browser cache, specify a width and height on your image
i have seen the most weird stuff on ie7, like pagebreaks \n and such causing this effect, ie:
to fix just put everything on the same line and without spaces (like your table with a space on the right)
also avoid using inline style, use a stylesheet (css)