no padding for content below sticky element

  • Resolved philmurray

    (@philmurray)


    6 years, 1 month ago

    hi

    Great plugin – i have it working on the site link above — however the page content seems to be losing it’s padding / margin and is crashing into the sticky element. My CSS has 40px top margin for .site-inner — so basically the page content should sit free from the top header.

    i have the sticky element set as .site-header

    any idea how I can fix this please?

    thanks

    Phil

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

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter philmurray

    (@philmurray)

    6 years, 1 month ago

    hi Mark

    Just wondering if you had a solution for this one?

    thanks

    Philip

    Senff – a11n

    (@senff)

    6 years, 1 month ago

    Thanks for trying my plugin. 🙂

    The reason that the content is high, is because the top margin of 40px is now from the top of the screen, not the top of the header. The header is sticky, so all other elements basically ignore it.

    To solve this, I would add a bit more padding to .site-inner, right about 100 pixels, but only for larger screens:

    @media screen and (min-width: 991px) {
   .site-info {
      padding-top: 110px;
   }
}

    Let me know if that helps.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘no padding for content below sticky element’ is closed to new replies.