Macbook 13" display issues

Can you show me what you mean by line wrap?

Sure can: https://www.screencast.com/t/0naCRc5n6C

#1 is the display on Macbook 13 and #2 is the same resolution on PC laptop (1680x1050)

It actually fits on my 13" macbook, but to stop that from happening you'd need to use a media query to reduce the:

a) main navigation font size
b) site logo image width

For the logo width, you could do this:

@media (max-width: 1000px) {
    .site-logo img {
        max-width: 200px;
    }
}

Of course you'll need to adjust both values to fit your needs.

Hi Tom, back from holiday here. When you say the display looks fine on your Macbook, the menu is not getting bumped below the logo?

No - it's somewhat close, but they're still on the same line.

Fascinating. Right now, I have a handful of clients that gripe about this because what they see is different than (for example) what you're seeing.

With all the variables that Apple throws into the mix, it's growing increasingly difficult to smooth this out without a lot of manual hoops to jump through.

As such, any insight you have on how to avoid this display disconnect issue, I'm all ears.

I would just reduce the width of the logo at a certain width. That way things will be on the same line on all screen widths (as long as you reduce it at the right width).

Many thanks.

No problem :)