Advanced Search Usage Terms Submit Contact
Dynamic Drive CSS Library
 
CSS Library
Submit an original CSS code
CSS Layouts
Web Graphics
Online Tools:

Advertise Here

CSS Library: Vertical CSS Menus: Here

Urban Grey Side Menu

Author: Dynamic Drive

This is nonchalant greyish side menu that blends right in with most designs. The menu headers are H3 tags with a non repeating background image as its bullet, while the menu links are all list based.

Demo:

Single image used (2 flavors to choose from): or

The CSS:

Note: The image path referenced in the CSS above assumes you're using the first green image. If you're using the second, be sure to update the image path accordingly.

The HTML:

Code Info

Rate this code:

Date Posted: 08/25/2008

Revision History: None

Usage Terms: Click here

Your Comments (23)

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 2 of 3 pages  <  1 2 3 >

How do I direct this to open in the same window. I assume it is a variation of the Target= command, but if you could direct me, that would be great.
Posted by Michael on 02/18, 12:41 AM
How the background of the tab that is selected
Posted by totge on 02/25, 02:38 PM
This is very nice. but the gap is too much between 1 heading to 2 heading to to set the gap can you people advice please
Posted by yasir on 03/10, 12:10 AM
I like the script but somehow I could not take the style out and pack it into a separate CSS-file and named it sidemenu.css. It didn't work then!

I had it on this page ...
http://www.chinabiz21.com/chinaexpat/chinavisaapplication.php
instead of the now shown menu in the right column

I added the css file to the head like ...
<link href="./../folder/sidemenu.css" rel="stylesheet" type="text/css" />
Am I missing something?
Posted by Mitch on 03/20, 10:17 AM
YASIR
look at the style part ... .urbangreymenu ul li{ .... and set the value to "0".
You can change anything you want, just play around, you'll see.

And give these guys who made it so easy for us some credit! cheers
Posted by Mitch on 03/21, 09:53 AM
Hi
i am using this menu in my .net application.But in my page, whenever any event fired or postback occurs,the menu will be automatically in expand mode.
Can anyone please help me.Its urgent..
Posted by Alok kumar Nayak on 04/05, 11:11 PM
That looks great. It is simple and attractive. Different colors might be more useful. I'll try.
Posted by Windows 7 on 05/05, 03:49 AM
Love it, simple and elegant.:o)
Posted by kramazeek on 05/14, 08:57 PM
Hey Thanks for this! I found lots that are very useful to me such as Anika presents Reuse. It's good to make some gifts for your friends during some festive season!
Boost Credit Score
Posted by Zeehshan on 05/16, 01:28 PM
Excellent menu.. i like it.
Posted by Free Software Download on 05/18, 07:55 PM

Comment Pages 2 of 3 pages  <  1 2 3 >

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