Nav bar not same in different browsers

Community Forums Forums Design Tips and Tricks Nav bar not same in different browsers

This topic is: not resolved

This topic contains 3 replies, has 2 voices, and was last updated by  David Chu 2 years ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #75874


    My subnav bar has appeared fine in all browsers, however just today something happened. In Firefox the navbar tabs appear fine straight across, however in Safari, the last tab to the right now drops down an additional line to the left.

    Why would this have happened and how do I fix it?

    Thanks for any insight.

    David Chu

    You’ve run into one of my pet peeves. :-) The basic problem is that Safari just does what it wants with fonts, and doesn’t care if it’s not like other platforms. If you look at the site in Chrome you will see that the subnav is also very tight. All it takes is a slight nudge to overflow. The simplest suggestion would be to edit your CSS (Appearance… Edit) and find the following code. Just try reducing the second figure on “padding”. 12px might fix it, or maybe 11px.

    #subnav li a {
    color: #55210C;
    display: block;
    font-size: 12px;
    font-weight: bold;
    margin: 0;
    padding: 6px 13px;
    text-transform: uppercase;

    Cheers, Dave

    Dave Chu · Custom WordPress Developer – likes collaborating with Designers



    Thank you Dave. Very frustrating especially since I’m a loyal Apple user…and based on my site stats, Safari is a top used browser. In any case, I did play around a bit with what you suggested…of course it then moves the centering off more in other browsers and when you hover the tabs it causes the other tabs to shift. May be best just to leave it. Damn Safari. :(
    I’m with you on that pet peeve!


    David Chu

    I hear ya. My savvy Mac friends tend to use Firefox, but obviously one has to at least reasonably address something popular like Safari. It just won’t cooperate in the text realm. At least it doesn’t matter much unless it gets to really tight tolerances. I have a designer friend who loves centering as well, and we always burn a little extra time and $$ on every project because of that.

    At times I will even do jQuery or CSS hacks to deal with Safari, IE, or [insert other crud browser here] where needed. But that’s more work and skill needed, and should be charged accordingly. :-)

    Cheers, D

    Dave Chu · Custom WordPress Developer – likes collaborating with Designers

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.