CSS drop-down being overlapped by content in IE7

I'm having this issue in IE7 with my drop down. Whenever I hover over my dropdown it goes up as soon as i hover over an element on top of the content. http://www.legrandconfectionary.com/gift-boxes/

I thought a position: relative on the header would solve the problem but on certain pages like the truffle flavors I have a tooltip effect that goes under the nav i开发者_如何学Gof done so. I'd really appreciate some help on this. Thanks!

There are several ways that you can fix this. Here's two:

• Set the a tag to display: block, and then make your hover events based on the a instead of the li.

or

• Specify a height other than auto or 100% for the li's