CSS DIV悬停在Internet Explorer 8中不起作用

Question

当我在Internet Explorer 8中将DIV元素悬停时，我的CSS规则未正确应用。

以下代码可以正常工作：

<div id="album-view">
<div class="loading"></div>
<div id="main">
 here is my all code, this code works.
</div>
</div>

但是，在下一个摘录中，该代码不适用于.loading和display:none; .loading 属性：

<div id="album-view">
  <div class="loading" style="display:none;"></div>
  <div id="main">
   Not working
  </div>
</div>

如果有人有任何建议，请帮助指导我正确的方向。

您可以看到我的测试服务器nasir.herobo.com/s.html#!/4或屏幕截图http://i.stack.imgur.com/Crvmy.png

Answer 1

在IE8中，您的显示：无；由于它是内联样式，因此不会被您的CSS覆盖。 您将必须使用JavaScript更改内联样式，或添加显示内容：none; 到你的CSS而不是元素。 与较新的浏览器相比，IE8及以下版本具有不同的样式层次结构。

Answer 2

我最近在ie8上遇到了css：hover问题。 我的不透明度更改在悬停时无法正常工作，因为应用：hover样式的div包含子div，且其css位置属性为“ relative”。 对我而言，“相对”不是必需的样式。 将position属性更改为static可以解决问题，并且将悬停时的不透明度更改按预期进行。

我花了几个小时的时间来研究答案，最终解决了自己。 希望小贴士能帮助别人。