Welcome to WebmasterWorld Guest from

Forum Moderators: not2easy

Message Too Old, No Replies

styling a link box

11:38 pm on Nov 25, 2010 (gmt 0)

New User

5+ Year Member

joined:Jan 17, 2010
posts: 23
votes: 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.
12:59 am on Nov 26, 2010 (gmt 0)

Senior Member

WebmasterWorld Senior Member 5+ Year Member

joined:Aug 9, 2008
posts: 961
votes: 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 {

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members