Black Friday Sale! Get up to $40 off GP Premium!Learn more

[Resolved] Responsive menu and header / logo

Home Forums Support Responsive menu and header / logo

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #74651
    Ingrid Wildschut

    When i put a header logo (image) above the menu the image will be smaller when looking on a phone. But we get a lot of space between menu and the image.
    What can I do to make the space smaller.

    www.http://nanettevandersnoek.com/

    I have now put a pageheader above every page. But the problem you will see with the blog.

    #74786
    Tom
    Lead Developer
    Lead Developer

    Are you talking about that little space below the header?

    That space is your “Separating” space which you set in the Spacing add-on.

    You can set your “Content Layout” to “One Container” in the “Layout” section of the Customizer which will remove these spaces.

    If you only want to remove the space below the header, you can use this CSS:

    .separate-containers .site-main {
          margin-top: 0;
    }

    Let me know if that helps or not 🙂

    #75789
    Ingrid Wildschut

    I think that I didn’t explane correctly. One the computer is just fine. If you look on the page with a mobile the space between the header and the menu is a lot bigger than on the computer.
    You can see it on this page with your mobile.

    If I use the pageheader, the menu will be above the header and not below of the header it works just fine. But I want the menu below the header.

    http://nanettevandersnoek.com/category/blog/ (de page with the space between the header en menu on the mobile

    http://www.nanettevandersnoek.com (the page with a page header.

    I hope that I explaine me better.
    Sorry for my English.

    #75987
    Tom
    Lead Developer
    Lead Developer

    Ahh I see! You’re adding your header as a header background, and then adding padding to give the header height.

    Instead of that, go to the Customizer and open the “Header Content” section – then upload your header/logo through there.

    Then you can remove the padding and background image, and the header will look good on desktop and mobile.

    Let me know 🙂

    #80710
    Ingrid Wildschut

    That great it’s working.

    #80716
    Tom
    Lead Developer
    Lead Developer
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.