How to prepare menus with CSS styles.
By admin, September 16th, 2009,in styling, web browsers, web design, web tools | Comments Off
Other CSS-based menus that I saw before I wrote these required different classes for every level of the menu to be present on every list item, which I felt made them unnecessarily complex. So when I originally approached the problem of creating a menu from nested list markup, I wanted to have it work without needing to add any additional markup—just vanilla XHTML list markup and the CSS.
What follows is an exercise that will teach you how to create CSS drop-down menus from “ID-and-class-free” lists. All that’s required is context—a surrounding div with a class, so the correct CSS styles are applied to the list within. The biggest benefi t of this all-CSS based approach is that it scales to a limitless number of choices at every level, simply by adding more items to the nested lists, without any modifi cations to the CSS.