扩展在IE7中出现在画廊下面的菜单 [英] expanding the menu appearing underneath the gallery in IE7

问题描述

我有一个正在工作的丰富多彩的菜单（Destaques，Roupas，Sapatos和Fale Conosco），但IE7位于页面后面，因为我试图使用z-index ，但似乎没有任何工作，有没有人有任何提示？

将鼠标悬停在使用IE7的菜单上可以实现我正在谈论的内容。

这里有很多事情要做，但我会尽力解决它。

首先，尝试着让你的HTML验证。有很多无效的HTML可能导致问题。

http://validator.w3.org/check？ uri = http％3A％2F％2Fwww.montepage.com.br％2Finfantile％2F& charset =％28detect + automatic％29& doctype = Inline& group = 0

其次，我相信IE7对z-index有趣。它根据它的父项重置它的z-index。我知道我过去遇到过这个问题。基本上，如果两个父元素是这样的：

 < div id =parent1> ...< / div> ; 
< div id =parent2> ...< / div> 
  

如果parent1的z-index低于parent2，则parent1将低于parent2，而不考虑其z-索引值。你可以尝试做的是确保parent1具有更高的z-index。

从你的代码看，它的父元素似乎是： p>

 < div class =colorido> <！ - 菜单容器 - > 
 ... 
< div id =corpo> <！ - 旋转的图像宣传容器 - > 
 ... 
  

查看是否将colorido设置为比公司的作品。您可能必须将它们设置为position：relative，以便它可以正常工作。

对于我来说阅读HTML和CSS很困难，这里有很多事情要做。所以，我可能有错误的容器，但希望这个想法可以帮助你。

这个页面可能会帮助您找到一些答案以及其他一些技巧：
http：// aplus .rs / css / ie7-bug-will-not-render-z-index-change-on-lihover /

希望有帮助！

I have a colorful menu ("Destaques", "Roupas", "Sapatos" and "Fale Conosco") who is working, but IE7 is behind the gallery is on the page, as I tried to solve using z-index, but nothing seems to work, does anyone have any tips?

page link

Hovering the mouse over the menu using IE7 realize what I'm talking about.

解决方案

There's a lot going on here, but I'll try to take a crack at it.

First, try to work on getting your HTML to validate. There's a lot of invalid HTML that could be leading to issues.

http://validator.w3.org/check?uri=http%3A%2F%2Fwww.montepage.com.br%2Finfantile%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

Second, I believe IE7 does something funny with z-index. It sort of resets it's z-index based on it's parent. I know I've ran into this issue in the past. Basically, if two parent elements like this:

<div id="parent1">...</div>
<div id="parent2">...</div>

If "parent1" has a lower z-index than "parent2", all children of "parent1" will be lower than "parent2", regardless of their z-index value. What you can try to do is make sure "parent1" has a higher z-index.

From looking at your code, it seems like the parent elements are:

<div class="colorido">  <!-- the menu container -->
...
<div id="corpo">    <!-- the image promotional container that rotates -->
...

See if setting "colorido" to a higher z-index than "corpo" works. You might have to set them to "position:relative" so that it works.

It's hard for me to read that HTML and CSS, there's a lot going on here. So, I might have the wrong containers, but hopefully the idea can help you.

This page might help lead to some answers as well as some other tricks to try: http://aplus.rs/css/ie7-bug-will-not-render-z-index-change-on-lihover/

Hope that helps!

这篇关于扩展在IE7中出现在画廊下面的菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！