I notice that chrome and firefox handle padding

I notice that chrome and firefox handle padding differently. Is there a way to target padding in chrome only.

My menu in chrome hovers over to lines. If i reduce the padding in the nav by 3px it works but then in firefox there is a big gap in the menu at the end after contact us.

see the site in chrome and firefox

http://www.kickgrowth.com/easts/

thanks

  • Ash
    • WordPress Hacker

    Hello @vivaarturo

    Welcome to WPMU community!

    I hope you are well today and thanks for asking the question.

    Firefox and chrome handles padding in exact same way, there is no difference :slight_smile:

    I checked your site in both browser and yes, you are right. But the problem is not with padding, problem is with the font you are using. I can see you are using “Telax” font and the font is being rendered differently in two browsers. If you use a simple font like Arial or tahoma, you will see exact same padding in both browsers.

    Though I have a quick hack for you. Please add the following code in your footer.php:

    <script type="text/javascript">
    jQuery(function($) {
    if($.browser.webkit){
    $('.navbar .nav > li > a').css({
    padding: '15px 4px'
    });
    }
    else if($.browser.mozilla){
    $('.navbar .nav > li > a').css({
    padding: '15px 5px'
    });
    }
    });
    </script>

    Please let me know if it works.

    Please let me know if you find this is helpful, or if you have any further questions.

    Cheers

    Ash

  • Ash
    • WordPress Hacker

    Hi there,

    When I tested in console it worked fine for me. Do you have any cache plugin enabled, if yes – delete the cache.

    You can send me login details via our contact form.

    To send details, please use our contact form: https://premium.wpmudev.org/contact/

    Select: I have a different question

    Subject: Attn-Ash

    Details: Send all required details (admin info and ftp details) with a link of this thread, so that I can track.

    Also post a note here once you send the info.

    I will be happy to take a look :slight_smile:

    Cheers

    Ash

  • Ash
    • WordPress Hacker

    Hi there

    I can see menus are changed now. But anyway, yes as I said font is rendered differently in different OS and different browser. You can’t have exact same in all browser unless you use Cufon.

    So, it’s better to use Cufon for font rendering, otherwise you can’t have exact same font in all browser/OS.

    You can make some changes in the above code or your css code to get the menu in one line.

    Cheers

    Ash

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.