top centered header on smaller screens

  • Resolved sandbox.pictures

    (@freiraeume)


    5 years, 8 months ago

    I have set my menu layout in top, centered. On smaller screens it is’nt centered. It is a few to the right side. Maybe it’s the hamburger menu on the left side. My Webside is also centered so it stands out.
    What can I do to change that?

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Theme Author satoristudio

    (@satoristudio)

    Hey @freiraeume, the header alignment options in Bento only apply to full-screen modes, on mobile screens the menu always hides under the hamburger and the logo floats left – our testing showed that other configurations are much less usable in cases of less available horizontal space.

    Thread Starter sandbox.pictures

    (@freiraeume)

    Thank you. I have solved the first problem by now. I had a logo, which could also be a header image, with a lot of white space left and right used. As a result, the logo has probably shifted so far to the right.
    Is there still the possibility to create a symmetry for the page by aligning the logo on the right side and the menu with the hamburger left?

    Theme Author satoristudio

    (@satoristudio)

    You can try forcing the logo to float right on mobile with this code:

    @media screen and (max-width: 64em) {
    .logo-image-link { float: right !important; }
}
    Thread Starter sandbox.pictures

    (@freiraeume)

    Thank you.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘top centered header on smaller screens’ is closed to new replies.