I have encountered a problem I can’t fix! I’ve tried 1000 things.
Here’s the problem: My dropdown navigation menu in IE8 isn’t showing the text of the
tags. The
tags are set to display: block and have a background color and hover state, and it is showing up fine. The problem is the text of the links has disappeared… But only for the child
items in the dropdown.
Has anyone ever encountered this before?
I happen to be using the Simple Jquery Dropdown plugin but I don’t think that’s causing the problem. I’m also using Cufon to replace the font. I’m not sure I’m allowed to post the URL since it’s still in development.
Here’s the HTML:
and Here’s the CSS:
nav {
display: block;
margin: 22px 0 0 0;
width: 100%;
height: 18px;
}
nav ul {
position: relative;
z-index: 100;
}
nav ul li {
display: block;
float: left;
font-size: 14px;
margin: 0 7px 0 0;
zoom: 1;
}
nav ul li.hover, nav ul li:hover {
position: relative;
}
nav ul li.last {
margin: 0 0 0 0;
}
nav ul li a {
display: block;
text-align: center;
width: 200px;
height: 18px;
background: #fff;
color: #000;
text-decoration: none;
}
nav ul li ul {
visibility: hidden;
position: absolute;
top: 18px;
left: 0;
}
nav ul li ul li {
float: none;
height: 18px;
}
nav ul li ul li a {
border-top: 1px solid #666;
display: inline-block;/* IE 6 & 7 Needs Inline Block */
width: 200px;
margin: 0;
}
body#cuisine nav ul li.cuisine ul li a {
background: #fff;
color: #000;
}
body#cuisine nav ul li.cuisine ul li a:hover {
background: #339999;
color: #fff;
border-top: 1px solid #666;
}
I really, really appreciate anyone’s and everyone’s time. I’ve got an IE8 only stylesheet but since nothing’s been working I may as well not even post that.
I can’t see anything particularly wrong with your css besides for it being a little bloated. Do you have a link to the site? It’s much easier to debug than looking at html and css
Author
Posts
Viewing 2 posts - 1 through 2 (of 2 total)
The forum ‘CSS’ is closed to new topics and replies.
