navigation links too low

[Nicholas Spartan]

The links in my navigation bar are appearing lower than normal below the black header bar just above the slider making them invisible (white on white)
It’s happening in multiple browsers.

nickkringas.com

Is there a fix for this?

[Bill Robbins]

That usually happens when the navigation links are too long to fit in the area available to them. They get bumped down so they can expand. There’s actually a bit of space allotted to your logo that’s free that we could use with a quick edit. Here’s how.

1) Go to the appearance section and select edit to open up the theme editor.
2) From the list of files on your right, choose style.css
3) Look for this spot:

#logo {
float: left;
margin-top: 20px;
width: 350px;
}

and replace it with this:

#logo {
float: left;
margin-top: 20px;
width: 310px;
}

4) Save your changes.

See if that doesn’t give you a bit more room to work with. Beyond that, you could scroll down a bit further until you see this spot:

.menu a, .menu a:visited {
color: #fff;
display: block;
margin: 0;
font-size: 16px;
font-weight: bold;
padding: 15px 9px 14px;
}

and change the font-size: 16px; to a smaller number to make the navigation links themselves a bit smaller.

If you need any help, let me know.

[Nicholas Spartan]

First of all Bill, let me say that so far your support has been personalized and nothing short of excellent. I have always received a quick response from you and I really appreciate it! thanks.

The navigation fix worked.. thanks again.

one more question… is there a reason the favicon would work in some browsers but not in others?

[Bill Robbins]

Glad I could help. I do try to be quick and thorough.

There are some limitations in browsers with regards to the file types they support for Favicons. All browsers will support an ico file, but only Internet Explorer (at least in the older versions) will not support a PNG file.

PNG’s look best, but ICO’s work everywhere.

Hope that helps.

[Author]

Posts