StudioPress

Forum navigation

Are You Using The WordPress Block Editor?

Genesis now offers plugins that help you build better sites faster with the WordPress block editor (Gutenberg). Try the feature-rich free versions of each plugin for yourself!

Genesis Blocks Genesis Custom Blocks

Menu Spacing Not Consistent Across Browsers

Welcome!

These forums are for general discussion on WordPress and Genesis. Official support for StudioPress themes is offered exclusively at My StudioPress. Responses in this forum are not guaranteed. Please note that this forum will require a new username, separate from the one used for My.StudioPress.

Community Forums › Forums › Archived Forums › General Discussion › Menu Spacing Not Consistent Across Browsers

This topic is: not resolved

Tagged: , ,

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • April 15, 2014 at 4:46 pm #100603
    Kent
    Participant

    I built a site here:

    http://www.darrylwhetter.ca

    based on the minimum pro theme. I adjusted the spacing of the top menu to accommodate some more items. For some reason it looks great in Safari and Chrome (on a Mac) but in Firefox, the spacing is wonky and the last menu item drops to the next line, particularly on sub-pages.

    Anyone have any ideas what I'm missing? I thought it was usually Safari and Explorer that were the odd ones out.

    Dad. Biker. Designer. | kentfackenthall.com

    http://www.darrylwhetter.ca
    April 15, 2014 at 5:53 pm #100608
    DWooly824
    Member

    Hi Kent,
    I consistently have the same issue too. My workaround is just to reduce the padding to prevent the last item from dropping. It would be great if someone knows a real fix.
    -D

    February 3, 2017 at 11:26 am #200518
    jdfearon
    Member

    My website design had the same issue

    February 7, 2017 at 9:18 am #200706
    Victor Font
    Moderator

    You have to understand that Safari, Firefox, Chrome, and Edge all use different rendering engines. A rendering engine is the part of a web browser that displays content. Chrome and Opera use Blink, Safari uses WebKit, Edge uses Microsoft's proprietary EdgeHTML engine, and Firefox has used Gecko for ages, but even that is changing now. Gecko originated in Netscape Navigator in 1997. As part of Project Quantum, Firefox is adding pieces of the new Servo engine to Gecko this year. Eventually, Servo will replace Gecko altogether.

    Since all of these browsers use different rendering engines, they will render and display CSS differently. The trick is to find the lowest common denominator that works across all browsers, or add browser specific CSS as described here: https://victorfont.com/chrome-safari-conditional-css/

    Regards,

    Victor
    https://victorfont.com/
    Call us toll free: 844-VIC-FONT (842-3668)
    Have you requested your free website audit yet?

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘General Discussion’ is closed to new topics and replies.