css link not making all text a link?

I have dropdown men开发者_StackOverflow中文版u and its made via a list and position absolute, however the dropdown links are very very very small area and do not cover the text completely.

How can I fix this?

Example http://outreviews.com/v%202/index.html (the dropdown menus)

---

Remove the padding from the sub menu's UL and LI and give the A element "display:block" This will make the A element take up the entire width of the menu.

You can fiddle with the padding to get it the way you want it.

---

If you add:

ul li a {
display: inline-block;
width: 100%;
height: 100%;
}

It should work okay, and since even IE allows display: inline-block; on natively in-line elements it should be relatively cross-browser friendly (certainly under a valid doctype).

It's worth remembering that padding on the parent li will also reduce the possible width of the child a element, and the display: inline on the same parent li is also likely to cause you a little trouble (since display: block; on the a would be so much simpler).

---

Edited to note that @Chris Bentley correctly noted the points in my final paragraph (above the hr) just prior to my answer.

---

make the following changes:

in #headermenu li change the padding:20px; to padding :0 20px;

add delete the top:55px; from #headermenu li ul

---

What you can do is make the li elements display:list-item and the a elements display:block. That's what's being done on the site you're linking to.