Home › Forums › CSS › First website – hover problem › Re: First website – hover problem
Your CSS will work fine, you just need to alter the definitions slightly.
For a full run through of css classes see this article: https://css-tricks.com/multiple-class-id-selectors/
Since you have applied the class names to the <li> elements not the <a> elements you need to defined the two change of background rules as follows:
background-position: center bottom;
}
however as your background isn’t applied to your <a> but to your <li> you’ll need to apply the background to your <a> (some versions of IE don’t support hover on non-<a> elements):
width: 111px;
background: url(“images_main/paintlink.gif”);
background-position: center top;
}
ul#nav li.ceramics a {
width: 252px;
background: url(“images_main/ceramicslink.gif”);
background-position: center top;
}
and remove the background rule from the li’s.
Hope that helps & all makes sense!