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

CSS Library: Horizontal CSS Menus: Here

Slanted Divider Menu

Author: Dynamic Drive

We got our inspiration for this menu from Simplebit's bulletproof slants. It's an elegant CSS menu bar that uses a transparent "slanted" image to act as a divider and separate each menu item. Change the background color of the menu as desired. It differs from the Simplebits code in that no floating is used, enabling you to easily align the menu items either to the left, center, or right, just by changing the "text-align" property within the CSS code.


The single image used:

The CSS:


Code Info

Rate this code:

Date Posted: 05/25/2006

Revision History: None

Usage Terms: Click here

Your Comments (25)

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

wow, excellent code, helped me in nick of time. thanks a lot :)
Posted by simsys on 11/06, 01:56 PM
I don't understand this:
/*Add margin between menu and rest of content in Firefox*/

can someone explain because I do get a 5px gap only in Firefox.

Posted by BB on 12/05, 12:52 PM
Thanks for this. I got the link from a comment you left at another site and found it to be a great compilation of the story thus far.
Posted by home drug test kits on 04/02, 12:40 PM
çok hoş ve sade bir menü.

very nice
Posted by gempili on 04/27, 07:41 AM good for me. i'm from indonesia
Posted by javacell on 05/15, 12:17 AM

Comment Pages 3 of 3 pages  <  1 2 3

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