Shrinking browser loses headline

Support
#1

Hi there! I’m having an issue with a cut-off headline. My page is https://www.pacify.com/legal-notices/

When I shrink the browser or view this page on a mobile device, the sticky header is blocking/cutting off the headline at the top of the page. How can I make it so that I maintain the margin/padding between the header and the headline at all sizes?

Thanks!

#2

Hi There,

Thanks for writing in!
I can see a custom CSS which is causing the issue. Can you please check this in Theme Option -> global CSS or the page CSS and remove it.

@media (max-width: 979px)
body.x-navbar-fixed-top-active .x-navbar-wrap {
    height: auto;
}

If this CSS is related to any other page you can wrap it to a page specific class.

Hope this helps!

#3

Thanks @basanta, but I believe I need that to keep my nav bar sticky at the top of the screen when I scroll (on all pages). Removing that code fixes the covered content issue but makes my nav bar scroll away, no longer sticky.

#4

Hi There,

In that case, could you please try adding the following CSS rule and see if that helps.

@media (max-width: 979px)
  .entry-content.content {
    margin-top: 25px;
  }
}

Hope that helps.

#5

That worked perfectly, thank you as always for the great support!!

#6

You are most welcome!