Hello there,

I have some broken navigation that only appears in IE 7 and IE 6. I am not concerned about 6. It seems as if there is some space between the list items which means that when your navigation is over a header and you hover over the header (which is under the nav) the browser doesn't register that you are still over the nav and it closes the nav. Any idea on how to fix it?

I looked through my code for margins, or borders but didn't see any that would cause this problem.

Here is the development site: http://bit.ly/bDw0eh

2 answers

Carlos 60
1
point

huh, weird. i was looking at your code and after making some changes i fount the float under "#nav ul ul li" to be the problem, whenever that item was floated it would break it.

I also did some small changes to the code

here it is:

        #nav ul ul{
            position:absolute;
            border: 1px solid #DADADA;
            top:100%;
            left:0;
            width: 230px;
        }
                #nav ul ul li {
                    position:relative;
                    width:230px;
                }
                    #nav ul ul li a {
                        padding: 5px;
                    }
        #nav ul ul ul {
            left:100%;
            top:0;
        }

        #nav ul ul,
        #nav ul li:hover ul ul,
        #nav ul ul li:hover ul ul{
            display:none;
        }
        #nav ul,
        #nav ul li:hover ul,
        #nav ul ul li:hover ul{
            display:block;
        }
Answered over 8 years ago by Carlos
0
points

I figured it out! I added background color to the li tag and it worked. That is bizarre. Any idea why that works?

Answered over 8 years ago by Patrick Rauland