How to make the topheader area sticky too

Asked on December 14, 2016 in Customization.



Just wondering how i would make the topheader sticky and have it appear too when scrolling down together with the header menu.


Any ideas?


Best regards,


Bunkerboy Layers User

Seems this forum is quite pointless… 3 answers formulated to the last 20 questions?

Is anyone from Layers even following this forum?

on December 16, 2016.

Hi there,

As outlined in our support policy, this is a community-driven forum. Layers team stop by on a voluntary basis. Most questions are answered in our main documentation, or you can contact us on Layers Messenger if you have a technical problem.

on January 17, 2017.
  • Possible Answers to Your Question:

  • 1 Answer(s)
    Answered on January 17, 2017. Best answer

    Sticking an element is done by adding “position: fixed;” to it’s CSS style.  If the header is already stickied, you also need to change the “top” value to make room for the top bar so it doesn’t overlap. something like:

    .header-secondary {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100;
    width: 100%;
    .header-sticky.is_stuck.is_stuck_show {
    top: 50px;

    How to see the existing styling:

    CSS Styling Using the Browser Inspector & Customizer

    Understanding the Top Bar classes:

    Layers Framework: Top Bar

    Vail Joy Layers Team