Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • December 17, 2020 at 4:21 am #1267995
    navindesigns

    On my site, https://theavantnyc.com/ the mobile header is very tall (extra padding at the bottom)

    1- How do I Reduce Size of header by removing that extra padding at the bottom?
    2- How do I make the mobile header sticky at the top when scrolling the page like on desktop?

    Thanks

    December 17, 2020 at 9:17 pm #1268201
    Victoria

    Hey navindesigns,

    Here are the docs for you:

    Header

    https://share.getcloudapp.com/Z4uq7bgJ You need to wrap this code in the media query.

    Best regards,
    Victoria

    December 18, 2020 at 2:08 am #1268285
    navindesigns

    #2 is perfect.

    #1- I added the following code but the extra spacing is still there on mobile

    @media only screen and (min-width: 990px) {
    .html_header_top.html_header_sticky #top #wrap_all #main {
    padding-top: 100px !important;
    }
    }

    December 20, 2020 at 1:02 pm #1268760
    Rikard

    Hi,

    Please try this CSS instead:

    @media only screen and (max-width: 767px) {
.responsive #top #main {
    margin-top: 148px !important;
}
}

    Best regards,
    Rikard

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