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

Underline Horizontal Menu

Author: Dynamic Drive

This is a sleek CSS horizontal menu with a popular "underline" effect shown whenever the mouse rolls over a link. Each link (<a>) also carries a background image, used to as the indented line graphic that separates each menu item. We choose to use a graphic instead of CSS's dashed line effect, since it seems to look better.


The lone image (resized for easier download):

The CSS:


Code Info

Rate this code:

Date Posted: 05/01/2006

Revision History: None

Usage Terms: Click here

Your Comments (40)

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

i really like it i might use it on my homepage.
Posted by Seich on 09/24, 09:20 PM
How do I position this on my page??
Posted by veronica on 10/04, 07:31 AM
simple and elegant in the page header...great menu! thanks
Posted by ejuliet on 10/30, 11:42 AM
so do you just post the positive comments. your stuff is fucked .......... asshole~
Posted by jo mama on 05/01, 09:59 AM
Is there anyway that I can make this menu centered? I have customized it to fit my needs, but cannot seem to get it to sit in the center of my table...
Posted by David on 06/25, 08:08 AM
Look at the footer on my page. Any idea what could be causing this?

I can't find a field that would cause the thick gray lines.
Posted by Gary on 06/25, 08:10 AM
Never mind... it is my menudivide file... I will modify that.
Posted by Gary on 06/25, 08:11 AM
how do i move the navigation to position it anywhere i like? how do i that?
Posted by jenny on 09/03, 01:17 PM
text-align:center will centre the menu...
Posted by richard fuller on 10/24, 12:55 AM


In my case I'd like to align the menu items to the right, but I believe it would be the same procedure.

Thanks in advance.
Posted by talofo on 10/30, 09:25 AM

Comment Pages 3 of 4 pages  <  1 2 3 4 >

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