homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

styling a link box

5+ Year Member

Msg#: 4235072 posted 11:38 pm on Nov 25, 2010 (gmt 0)

I have seen link boxes where when the mouse hovers on top of the box the colour at the top half of the box changes but the colour at the bottom half remains unchanged. How can this be achieved using the command:
ul#List li a:hover
{ background:#ADFF2F;
I have tried using a background image to fill the bottom half but nothing seems to work. I would be very grateful if someone could provide me with a solution.



WebmasterWorld Senior Member 5+ Year Member

Msg#: 4235072 posted 12:59 am on Nov 26, 2010 (gmt 0)

Hi raydona and welcome to WebmasterWorld ;)

I wonder if you have set the background image using background shorthand like:
ul#List li a {background: color url(myimage.jpg) bottom repeat-x}
If so, using background:#ADFF2F on hover removes the image and sets just a background colour. To change the background color but leave the image in place try:
ul#List li a:hover {

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved