A simple drop line menu. No frills or graphics and just one drop line.

The top level tabs are of unknown width that depends on the text within and the sub level is a fixed width. This could have been made a percentage width but IE6 doesn't play ball. Percentages will work in all browsers escept IE5.x and IE6. I am still looking for a way round this and will let you know if I find one.

As in the previou example, you can now click any of the links, top tabs or dropline, and the page will reload with your selection as the current highlighted choice. This is achieved by reloading the page and using PHP to read the query string of the selected link and write 'current' and 'current_sub' into the styles of that link.

Works in IE5.5, IE6, IE7, Firefox, Opera, Netscape, Mozilla and Safari (Mac and PC).


You may use this method on your personal 'non-profit' web site without seeking my permission. A link back to CSSplay is always appreciated.

Commercial usage is also permitted without seeking approval, but I would ask that a donation is considered to support my work on CSSPlay.

If you are having problems integrating any of my demonstrations into your website then I now offer a service to fault find and correct any errors that you may have introduced. Please email me for more information.

Please Support CSS play

Please note that if your donation is for a demo/menu then you will need to email me with the url of the demo/menu after making the donation

For more CSS demonstrations I recommend that you visit the Dynamic Drive CSS Library.

Free, practical CSS menus, layouts, and examples

Soft Geometry Creative Industries

Soft Geometry Creative Industries
is a music-based design company located in Bristol UK.
I create artwork for albums, singles, posters and t-shirts.
My work is influenced by punk and post-punk poster and flyer design,
lo-fi photocopy aesthetics,
Francis Bacon and Mark Rothko.

I can provide a start to finish service with my own art and photography, put together work from images provided by yourself, and collaborate on an idea.

Follow CSS play

Facebook   Twitter   Facebook Fan Page