Hostgator coupons for up to 99% off hosting for Dynamic Drive visitors!
Advanced Search Usage Terms Submit Contact
Dynamic Drive CSS Library

CSS Library: Vertical CSS Menus: Here

Glossy Vertical Menu

Author: Dynamic Drive

This is a CSS vertical menu that uses a thin, repeating background image that changes when the mouse moves over a link. The image is glossy looking with an indent at the bottom to create a nice separation between links.


The two images used:

The CSS:


Code Info

Rate this code:

Date Posted: 06/02/2006

Revision History: None

Usage Terms: Click here

Your Comments (151)

Got a question or need help customizing this CSS code? Post it in the CSS Forums. If you have a comment or suggestion instead, post it in the comments section below.

Comment Pages 15 of 15 pages « First  <  13 14 15

good site and good menu
Posted by jang on 01/20, 03:01 AM
I already try to change my blog view but by free down load from this site but it's not succes, can some body help me....please
Posted by indra on 01/28, 09:07 AM
When you rollover this menu, the favicon flickers. What is causing that?
Posted by bzsim on 02/09, 10:15 AM
good very good it is useful
Posted by belkadi on 02/10, 08:55 AM
To work correctly with IE7 I made this alteration:

* html .glossymenu li a{ /*IE only. Actual menu width minus left padding of A element (10px) */
width: 170px;

Not sure how it affects other IE versions.
Posted by Neil on 02/13, 05:25 AM
I used this menu in my website but for some reason there seems to be extra padding on the right hand side yet I have removed all the padding to see if that made a difference. This only seems to be a problem in IE and it is driving me nuts!
Posted by Donna on 02/24, 10:26 AM
I am new to css (learning still) I can make this work, I use DW4 - I have made the link to the external css and placed the html on the page - all I see is a row of dots - anyone point me in the right direction?
Posted by Carl on 04/03, 01:35 PM
How do i get rid of the bullets before the menu?
Plz. help...

Posted by Emad Zyed on 04/24, 06:23 AM
Changing 'repeat-x bottom left' to 'repeat top left' allows it to behave properly if your menu item spans two lines, which can happen with liquid layouts, and oddball resizes.
Posted by Sherwood Botsford on 04/24, 01:21 PM
This is a great code for menus. cheers for great clues
Posted by escort services central london on 05/13, 07:37 AM

Comment Pages 15 of 15 pages « First  <  13 14 15

Commenting is not available in this weblog entry.
Copyright 2006-2015 Dynamic Drive Read our Usage Terms before using any of the CSS codes.