3 replies [Last post]
greg9885
Offline
newbie
Last seen: 12 years 51 weeks ago
Timezone: GMT+5
Joined: 2007-04-05
Posts: 6
Points: 0

I'm kinda new to css and I can't figure out what I'm doing wrong with my menu to make it hover??
Here is the css:#menu {
float:left;
width:45px;
text-align: right;
margin-top: 40px;
}
#menu ul {
padding:0;
margin: 0;
}
#menu li {
list-style:none;
padding: 0;
margin-top: 15px;
margin-right: 0;
margin-bottom: 15px;
margin-left: 0;
}
#menu li a.work {
display:block;
width: 45px;
height: 119px;
text-decoration: none;
background-image: url(../../../Desktop/nav-work.jpg);
background-repeat: no-repeat;
background-position: 0 0;
}
#menu li a:hover .work {
background-position: -44px 0;
}

And here is the html:


Any help would be greatly appreciated, thank you.

Ed Seedhouse
Ed Seedhouse's picture
Offline
Guru
Victoria British Columbia
Last seen: 28 weeks 6 days ago
Victoria British Columbia
Timezone: GMT-8
Joined: 2005-12-14
Posts: 3570
Points: 675

Probably because your css

Probably because your css hover rule is too specific. it should be

#menu li a:hover

not
#menu li a:hover .work

Your way applies the hover only to an element with the classname "work" that is a child of an anchor element.

On the other hand we could diagnose things much more easily with all the code to look at, which the forum sticky messages (there for a reason, you know) ask for - did you read them - instead of just snippets as you've posted.

Ed Seedhouse

Posting Guidelines

Watch out! I am carrying irony, sarcasm and satire, and know how to use them.

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 5 years 38 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

It should be: #menu li

It should be:

#menu li a.work:hover { background-position: -44px 0; }

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference

greg9885
Offline
newbie
Last seen: 12 years 51 weeks ago
Timezone: GMT+5
Joined: 2007-04-05
Posts: 6
Points: 0

thanks, that's it!

thanks, that's it!