Tagged: 

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1170371

    Hey,
    I managed to make the mobile header sticky on my website by adding this CSS:

    .html_header_top.html_header_sticky #header {
    position: fixed !important;
    }
    @media only screen and (max-width: 767px) {
    .responsive #main {
    padding-top: 0px !important;
    }
    }

    However, it is now hiding part of the content, mainly the headers. I tried to fix this issue according to this post:
    https://kriesi.at/support/topic/mobile-sticky-header-hiding-content/
    Result: Content is not hidden anymore, but the header stops sticking and simply disappears again when scrolling on the mobile.

    Any ideas?

    Best regards,
    Meike

    #1170383

    Hey AlpseeDesign,

    Add this to quick css:

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

    Best regards,
    Jordan Shannon

    #1174909

    Hey Jordan,

    thanks, that caused a definite improvement of the header behaviour already.

    Not quite there yet though – once one starts scrolling down on the mobile and the sticky header shrinks, it also moves down a little bit so the content shows above the header when scrolling down.

    Any hint on how to fix this so the header really sticks to the very top of the page?

    Best regards,
    Meike

    #1175573

    Hi AlpseeDesign,

    Could you please attach some screenshots of the issue?

    The header behaves well on my end.

    Best regards,
    Victoria

    #1175810

    Hi Victoria,

    thanks for checking and apologies – actually it’s true, it stopped behaving strangely. Might have been a cache issue, I suppose.

    Great theme, great support, thanks a lot for solving this! :)

    Best regards,
    Meike

    • This reply was modified 4 months, 2 weeks ago by  AlpseeDesign.
    #1175834

    Hi,

    I’m glad this was resolved. If you need additional help, please let s know here in the forums.

    Best regards,
    Jordan Shannon

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Mobile sticky header hiding content’ is closed to new replies.