[Resolved] Center Navigation Button on Desktop

[Kyle]

Hi all, I’m using GeneratePress and GenerateBlocks to insert a navigation button using an Element. But I’d love to have the button centered in the nav bar on desktop view.

I’m currently using the after_logo hook and the Navigation as Header setting. Curious if there’s a way to center the button?

Staging Site: https://cend.yondermooncreative.com/

What I want to accomplish: https://drive.google.com/file/d/101i2enmBHpA649P6Td993IUo_ZBpKA-0/view?usp=sharing
What I have now: https://drive.google.com/file/d/1bX1cRpu_yXPB7LXP8tnIh7gmTSw5Zfqa/view?usp=sharing

Thanks so much!

[Ying]

Hi Kyle,

Try this CSS:

@media (min-width: 769px) {
    .site-logo + .gb-button-wrapper {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
    }
}

[Kyle]

Amazing, works perfectly! Thank you so much.

[Ying]

You are welcome 🙂

[Author]

Posts