Hi All
I've got an issue that I haven't seen before. I've got a fairly simple
vertical nav with nested lists.
For some reason, the links are not displaying as block level elements in IE.
Here's the CSS
#mainnav {background:#29475d; width:182px; list-style-
type:none;padding:10px 0 10px 7px;}
Drake, Ted C. wrote:
The rest of the styles use body classes to show or hide specific
nested menus.
Does anyone see a reason why the links would not display as block? It
is causing some flashing as you mouse over the links and hit dead
air. The hover goes off and on
Hi Ted,
To fix IE,
G'day
Drake, Ted C. wrote:
For some reason, the links are not displaying as block level elements in IE.
Here's the CSS
...
#mainnav li a {display:block; border-top:1px solid #fff; padding-right:5px;
padding-left:5px; text-decoration:none;
font-weight:bold!important; color:#fff;
#mainnav li {list-style-type:none; margin:0; padding:0;display:inline;}
You can't have a block-level element within an inline one... try changing display:inline to float:left instead
cheers
kemie
...:| kemie |:...
.:| www.monolinea.com
|:.
Ding, ding, ding,
We have a winner.
I used the display:inline/display:block
combination from this Andy Budd post:
http://www.andybudd.com/archives/2003/12/css_crib_sheet_1_gaps_between_vertical_nav_elements_in_ie5/index.php
When I switched it to float:left, the nav
elements shrank
Drake, Ted C. wrote:
I could probably generalize the holly hacks to the whole site, but
for now I am doing it on the individual nav. Are there reasons why I
shouldn't just say * html li and * html a ?
Did you try to use Conditional Comments instead of CSS filetrs?
IMO, that's where this
