• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 253
  • Last Modified:

Why is this gap appearing?

Head out to countryshowdown.com and pass your mouse over the links in the navbar. They work! Thing is, on my box, you see this nasty gap (see screenshot) that happens between the navbar and the links.

I'm thinking there's some ninja out there who can look at the discrepancy and go, "That's easy! All you've got to do is..."

Thoughts
Screen-shot-2012-03-16-at-3.52.3.png
0
brucegust
Asked:
brucegust
3 Solutions
 
LZ1Commented:
I checked in IE 7, 8 & 9 and I couldn't reproduce the issue. I also checked Chrome and FF and everything looks good. What version of IE are you using?
0
 
mgfranzCommented:
First of all, you need to classify which browser this error appears in, the only browser I can see a problem with is IE8 or <.  

Second, you need to clarify exactly where the problem is occurring, I had to snoop around in order to find where the problem was.  I found it by clicking on one of the "Top 10 Most Viewed Profiles" icons.

As for a solution, it may be a simple matter of adding a z-index property to your #nav li class.

z-index:3;
0
 
Tom BeckCommented:
The prime suspect is the top:26px you have under #nav ul. The gap you show in the image appears to be about 26px thick. Also, in FF 11, Chrome 17, and Safari 5.1, if you remove the top:26px, nothing changes, the sub menus still appear in the correct place. If you take out top:26px in IE8, the sub munues move up 26px. You may just need an alternate css for IE for #nav ul
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Tackle projects and never again get stuck behind a technical roadblock.
Join Now