[Resolved] Navigation won't float right

[Andrew]

Hi GeneratePress,

I can’t thank you enough for your amazing theme. It’s really helped me out the last couple of years.

Recently, I was given a GeneratePress site to do a partial redesign. I need to update the home page; however, when I set Header Layout to Navigation Right and Primary Navigation Layout to Float Right, it doesn’t want to float right. It’ll align right, but it’s not floating opposite the logo.

I’m using a Header Element on the home page to merge the background image with the logo and nav and add the transparent blue background.

(The site’s privacy username & password is: flywheel)

Thanks for your help.
Andrew

[David]

Hi there,

this is what i am seeing – what am i missing ? Let me know:

[Andrew]

Hi David,

Thanks for the quick response.

Funny. In Firefox, the header is aligning fine; however, Chrome isn’t.

I’m in working in Development mode so all caching should be turned off and I’ve tested in Incognito mode for both browsers.

Now I’m noticing in Firefox, the post module at the bottom is getting cut off, but in Chrome it’s fine.

Any ideas?

Thanks.
Andrew

[David]

See this occassionally where browsers interpret CSS Floats differently but not always – but nothing exact that i have a fix for accept for replacing them with Flex box.

Try adding this CSS:

@media (min-width: 1024px) {
    .inside-header {
        display: flex;
        align-items: center;
    }
    .site-logo {
        margin-right: auto;
    }
}

[Andrew]

Thanks, David. That seems to work!

Cheers.
Andrew

[David]

You’re welcome

[Author]

Posts