Vertical drop down menu

[littlevictorian]

Hello all. I'm relatively new to CSS, so please be gentle with me. I have a question about a vertical drop down menu I'm working on. It's looking decent so far. You can see it here, under my photo. But, as you can see in the photo, I'm hovering over "the little victorian." Obviously, I'd rather have the other categories move down while I'm hovering instead of being covered up. Make sense? I'm sure there are proper terms that I'm not using. I am also sure there is more information you need from me before anyone can answer. Just let me know what it is and I'll provide it! Thank you,Christina

[jeffman]

Some part of the drop menu (the ul and/or the li elements) needs a background color (so it's not transparent) and a z-index of 1 or higher (so it is rendered "in front of" the rest of the document). Doing that with the right combination of selectors can be tricky, so experiment. You'll also notice that your li elements don't always fit quite right, so you may want to change some dimensions as well.

[littlevictorian]

Thank you for your response! Yes, I could add a background color, but that's not exactly what I was hoping for. Is there a way to make the other list items move down when you hover and display a sub menu? For example, as I'm hovering "the little victorian," (photo above)and it's displaying the sub menu, is there a way to move the other list items down, so "let's be friends" and "topics" would be displayed below "our attic office?" Sorry, it's kind of hard to describe. I'll see if I can find an example out there.

[jeffman]

It's probably this ruleset that prevents that from happening:

#dropmenu ul li:hover ul {	 display: block;	 position: absolute;}

Try removing the position rule.

[littlevictorian]

That was it! Thank you so much!