Black Friday Sale! Get $20 off GP Premium, $40 off our new Lifetime license, and 45% off license renewals/extensions! Learn more

[Resolved] Top Bar Mobile Alignment

Home Forums Support Top Bar Mobile Alignment

  • This topic has 4 replies, 2 voices, and was last updated 3 years ago by Tom.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #416592

    Hello, fellow pressers!
    I use the top bar to display a member menu that is right-aligned.

    On mobile screens, it automatically centers itself because of this:

    (max-width: 768px)
    autoptimize_98f…0cca1c4a.css:7, {
    text-align: center;

    What is the best way to fix this?
    Do I have to override the CSS or can customizer do this? (if you resize the browser, you’ll see right away what I mean.

    Thanks! 🙂

    GeneratePress 1.4
    GP Premium 1.4.3
    Lead Developer
    Lead Developer

    Yea, we center things as that usually looks better on mobile.

    You can add this CSS though:

    @media (max-width: 768px) { {
            text-align: right;
        .top-bar .widget_nav_menu li {
            padding: 0;

    Let me know if you need more info 🙂


    Thanks Tom!
    I am tweaking the footer menu and will implement your styles asap. 🙂
    Enjoy the sunshine. 😉


    OK, it’s done.

    I just have to adjust the margins and/or paddings.
    For some reason, in desktop mode, the top bar extends further than it does on small screens. No big deal, I am happy with the right alignment.

    Lead Developer
    Lead Developer

    I just adjusted the CSS above to fix the padding 🙂

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.