Solved

Why is this gap appearing?

Posted on 2012-03-16
3
223 Views
Last Modified: 2012-08-14
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
Comment
Question by:brucegust
3 Comments
 
LVL 30

Assisted Solution

by:LZ1
LZ1 earned 166 total points
ID: 37791067
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
 
LVL 18

Assisted Solution

by:mgfranz
mgfranz earned 167 total points
ID: 37791082
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
 
LVL 38

Accepted Solution

by:
Tom Beck earned 167 total points
ID: 37791106
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

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
How to get the web content with different encodings 2 28
Autoprefixer and text editors 1 26
WordPress Themes 10 34
Wrapper for APPs 9 37
"In order to have an organized way for empathy mapping, we rely on a psychological model and trying to model it in a simple way, so we will split the board to three section for each persona and a scenario and try to see what those personas would Do,…
Developer portfolios can be a bit of an enigma—how do you present yourself to employers without burying them in lines of code?  A modern portfolio is more than just work samples, it’s also a statement of how you work.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

896 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now