View Full Version : I want to disinherit them all!

03-09-2012, 04:43 PM

I'm doing a vertical menu bar and I want the submenus to a) be wider than the main menu and b) have a smaller font size.

I've had no problem changing the width, font, font size, etc. on the Spry css page, but I haven't found a way to "disinherit" one level from another so I can style each one the way I want. Most of the things I tried have screwed up the menu in one way or another.

Can someone help me with this, pretty please with sugar on top?

03-09-2012, 05:52 PM
Commandment #10: http://www.dwcourse.com/dreamweaver/ten-commandments-spry-menubars.php

And God said, “let the styling for the sub-menus be separated from the styling of the main menu.” And it was, with the addition of a new style rule, so.

By creating a new style rule (ul.MenuBarVertical ul li or ul.MenuBarHorizontal ul li for submenu list items and ul.MenuBarVertical ul a or ul.MenuBarHorizontal ul a for submenu links – notice the second ul in the selectors) you can define CSS properties that apply only to submenus (or more precisely to unordered lists that are themselves within an unordered list). And, by the way, you only have to define the properties that you want to be different from the main menu. The rest of the properties will be inherited.