Mon, 2004-07-26 23:19
I'm trying to remodel my site using css instead of my old frameset and javascript menu, but the nav section isn't working as advertised.
I'm using a nested unordered list inside a div. The relevant part of my stylesheet is:
#nav {padding: 0;
margin: 0px;
float : left;
width : 200px}
#nav ul {margin-left: 20px;
padding: 0;
line-height: 1.5;
width: 180px;
font-family: Verdana;
list-style-type: none;}
#nav li {font-weight: bold;
font-size: 14px; }
#nav li ul li {font-weight: normal;
line-height: 1.2;
font-size: 12px;}
#nav a, a:link, a:visited {color: navy;
text-decoration: none;}
#nav a:hover {color: #0033CC;
text-decoration: none;}
That formats my text the way I want it to look. (Welll, almost -- the submenu doesn't display in the smaller, lighter typeface in Firefox, though it does in IE and in my style editor's viewer. ) Adding
#nav li ul {display: none;}
makes the submenu go away in IE (not in Firefox). So far reasonably good; at least it's doing something. But when I add
#nav li:hover > ul {display: block;}
nothing happens. The submenu stays hidden.
What am I doing wrong? It's probably something really simple. Thank you all in advance.
Tue, 2004-07-27 15:58
#1
Dropdown menu confusion
Ie doesn't like parent and child selectors, so using
#nav li:hover > ul {display: block;}
in an IE browser won't work. Not sure why though. Have a look for the suckerfish, that explains it all.
Tue, 2004-07-27 17:18
#2
Dropdown menu confusion
Problem is, I haven't even begun to address IE yet. This is Firefox I'm having the problem with, that's supposed to be so all-fired css compatible. No matter whether I do it with display:none or set the left margin way off the page, it hides fine but won't reappear. I must have written the hover wrong, but can't figure out how.
Once it works in Firefox so I'm sure the css is ok, then I'll worry about what I have to do to make it work in IE.
Tue, 2004-07-27 23:10
#3
Dropdown menu confusion
Hi Nodoka,
Can you post a link to an example page, it would make it easier.
Sat, 2004-08-14 20:47
#4
Dropdown menu confusion
http://www.storyanime.com/workstuff/index.htm. This is bare-bones, just the page and the stylesheet. It now does work in Firefox, Netscape 7, and Opera (probably thanks to a whatever:hover script); it still doesn't work in IE or Avant. I've probably done something wrong with the hover, but can't for the life of me see what.
Sorry it took me so long; Real Life dumped on me bigtime and on top of that I had to redo a bunch of pages to make life tough for a bunch of hotlinking scum. [/i]