css hover

[alexgeek]

I just spent an hour trying to do a css hover menu.
i did that tutorial on the pdf posted in some sticky.
everything worked vertically,
then I tried to do it horizontally, and it all messed up and was still vertical.
Could someone post the code for a horizontal hover bar?
it doesn't matter about sub menus, i just want one where it's a long bar, and the same background colour then when you hover one section (li) it changes colour.
If anyone could post me their's please.
I can adapt all the colours and stuff myself.
just need the basis.
Google has failed me this time :/

[RZX Developer]

hey mate try this site

http://www.13styles.com/

Wayne

[alexgeek]

thanks they look well nice

[RZX Developer]

No problem mate thats what all of us are here for to help each other

[alexgeek]

Sorry I forgot to say.
i don't want an image one.
I want it like:
normal:
background colour is black with white text home.
then hover:
background colour is dark grey text changes colour slightly.

if you get me

[RZX Developer]

try changing the background-image: to background-color: #hex;

[alexgeek]

Okay will try it now
thanks!

[c010depunkk]

http://www.cssplay.co.uk/menus/

[nashultz07]

Try this css code:

Code: Select all

#vdividermenu ul{
margin: 0;
padding: 0;
margin-bottom: 1em;
float: center;
font: bold 100% Tohoma;
width: 100%;
border: 2px solid #f0f0f0;
background-color: #f0f0f0;
}

#vdividermenu ul{ /*IE only rule, reduce menu width*/
width: 99.5%;
}

#vdividermenu ul li{
display: inline;
}

#vdividermenu ul li a{
float: center;
color: black;
padding: 2px 12px;
text-decoration: none;
background: transparent url() center right no-repeat;
}

#vdividermenu ul li a:visited{
color: black;
}

#vdividermenu ul li a:hover{
color: #f0f0f0;
background-color: #006600;
}

[alexgeek]

ahh thats perfect
thanks mate!