Navigation
Archive / Navbar Position Fixed Left Makes Logo in Mobile View Uncentered
This is archived content. Visit our new forum.

Tagged: 

  • Author
    Posts
  • January 19, 2017 at 12:16 pm #1336992
    Elle
    Participant

    How can I get the logo to be centered in mobile view?

    I’m doing the Icon stack and the Navbar is positioned Fixed Left. Would like the logo and navbar button to be centered, but keep the desktop view navbar positioned fixed left?

    Please let me know if that is possible.

    January 19, 2017 at 12:19 pm #1336993
    Elle
    Participant
    This reply has been marked as private.
    January 19, 2017 at 12:29 pm #1337009
    Joao
    Moderator

    Hi There,

    Please add the following code to Appereance > Customizer > Custom > CSS

    @media (max-width: 979px)  {
.x-navbar-fixed-left .x-brand, .x-navbar-fixed-right .x-brand {
    margin-top: -30px;
} 

.x-btn-navbar, .x-btn-navbar.collapsed {

    margin-left: 50%;
    margin-bottom: 20px;
}

}

    Hope that helps

    Joao

    January 19, 2017 at 12:43 pm #1337025
    Elle
    Participant

    It didn’t work on getting it centered.

    Is there anyway to get the navbar and the logo centered in mobile view? Like the Logo (centered) then the navbar menu underneath the logo?

    January 19, 2017 at 12:52 pm #1337043
    Joao
    Moderator

    Hi There,

    Please try:

    @media (max-width: 979px)  {
.x-navbar-fixed-left .x-brand, .x-navbar-fixed-right .x-brand {
    margin-top: -30px;
 float: none;
} 

.x-btn-navbar, .x-btn-navbar.collapsed {

    margin-left: 50%;
    margin-bottom: 20px;
}

}

    Hope that helps

    Joao

    January 19, 2017 at 1:00 pm #1337062
    Elle
    Participant

    Awesome! Thanks Joao!

    January 19, 2017 at 1:02 pm #1337067
    Joao
    Moderator

    Glad to hear it 🙂

  • Author
    Posts
  • <script> jQuery(function($){ $("#no-reply-1336992 .bbp-template-notice, .bbp-no-topic .bbp-template-notice").removeClass('bbp-template-notice'); }); </script>