[Resolved] Sticky Nav issues on Logo Centered Header/Navigation

Home Forums Support Sticky Nav issues on Logo Centered Header/Navigation

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1310538
    John

    Hi there,

    I am trying to add a sticky header to the site attached below.
    But I cannot seem to add it without the menu items switching back to being left side of the logo.
    There also seems to be issues with the width of the logo – it appears to be very narrow.

    I am not sure why this is happening as I have used the same method on a previous site,.
    But I have tried so many combinations I cannot see what is wrong now.

    I have sent an admin login to your support email so you can login and see.: wordpress@generatepress.com

    the css I am using is:

    .navigation-branding, .site-logo, .sticky-navigation-logo {
        position: absolute;
        top: 10px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        z-index: 200;
    }

    Any input you have to help me fix this would be great!
    Cheers
    John

    #1311132
    David
    Staff
    Customer Support

    Hi there,

    add this CSS:

    .main-navigation:not(.slideout-navigation) .main-nav {
        flex: 1;
    }
    #1311893
    John

    Thanks for that.
    This seems to have fixed the issue of the placement, but the logo still appears all squished in the sticky nav.
    Any ideas on what is causing that?

    Cheers!
    John

    #1312210
    David
    Staff
    Customer Support

    In your CSS here

    Change the selector from:

    .navigation-branding, .site-logo, .sticky-navigation-logo {

    to

    .navigation-branding, .site-logo {

    #1314898
    John

    Great – thank you

    #1315254
    David
    Staff
    Customer Support
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.