Firefox：div：hover只在第一行工作 [英] Firefox: div:hover only working on first row

问题描述

• 我有一个非常简单的表，包含一个div，显示一些较小的内部div。




• 在Chrome和Chrome浏览器中可以正常工作。 Safari。




• 在Firefox 8中，hover仅适用于第一个TR，而第二个TR则<




• 代码没有验证错误。

  >任何想法可能导致这种行为？




• 在 http：// jsfiddle上工作jsfiddle .net / gNBSc / 9 /

解决方案

不要善待你的位置：相对到 tr 本身（我不知道为什么，没有时间来查找它）。这具有全部您的 div.hover 元素堆叠在第一个表行上的效果（见此处，添加了边框以清除）。

作为解决方法，您可以将每个 tr 的内容封装在 div 中，并应用 position：relative 代替 tr ， div 。

• I have a very simple table, containing a div that shows some smaller inner divs upon rollover. Just plain old CSS2, nothing fancy at all.

• Works as expected in Chrome & Safari.

• In Firefox 8, however, the :hover only works on the first TR - while the second TR is exactly the same.

• Code has no validation errors.

• Any ideas what might be causing this behaviour?

• Working jsfiddle on http://jsfiddle.net/gNBSc/9/

解决方案

Firefox is not taking kindly to your applying position:relative to the trs themselves (I am not sure why, did not have time to look it up). This has the effect of all your div.hover elements being stacked on the first table row (see it here, added borders to make it clear).

As a workaround, you can wrap the contents of each tr in a div, and apply position:relative to that div instead of the tr.

这篇关于Firefox：div：hover只在第一行工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！