Padding Color change on rollover?

HTML & CSS
1

Hello,

I am working with the CSS on a wordpress template, and I almost have it looking the way I want - there are dropdown menus, and I can get the menu items to highlight on rollover, but not the entire box (the padding) - is there a way to do this ?

Here is the link: http://colingoldberg.com/_c0lin/

Thanks !
Colin

2

Awesome thanks guys

3

I can’t see css atm :stuck_out_tongue:

4

You need to make the anchor a block.

It was set as a block on line 15 in the dropdown.css

#nav a{
display:block;
float:none;
}

5

Colin
You need to make the anchor a block. Check http://rbenson.info/examples/menu.php for an example. I haven’t fixed my template for that page so ignore the php errors.

6

Hi,
Remove the 10px top and bottom padding from the LI and move it to the anchor.

#nav li ul a {
height:auto;
padding:10px 0 10px 12px;
width:12em;
z-index:99;
}

You already had the 12px left padding on there so be aware that it is adding to the 12em width.

7

I cant see your css.
but I am guessing this is what’s missing…
your anchor tag has padding left/right, but not top bottom padding. the space that you see above and below is probably caused by either:

  • padding on the LI
  • margin-top/bottom on the anchor tag

find which one of the the two style rules it is, get rid of that declaration ( not the rule… just the declaration for margin or padding) and add the same value as padding-top/bottom and you should be set

hope that helps