A fixed header/menu

Premium Theme Support Pro Theme Design Chronicle A fixed header/menu

• 

  railturkey · Member · February 19, 2021 at 12:20 pm

  • Copy link
  • Add topic to favorites

  Hi Ben,

  Can I fix the header and the top menu?

  It would be good for a magazine to see its name continuously..

  Cheers.

  Onur U.

  The blog I need help with is: (visible only to logged in users)

• 

  binarymoon · Theme Author · February 19, 2021 at 9:24 pm

  • Copy link

  Hi Onur

  You can use the following css to make the header sticky. I set this to only work on larger screens since it would cover a lot of the screen on a mobile.

  @media only screen and ( min-width: 800px ) {
  
  header.masthead {
      position: sticky;
      z-index: 10;
      top: 0;
  }
  
  }

  Cheers – Ben

• 

  railturkey · Member · February 20, 2021 at 1:14 pm

  • Copy link

  Wonderful..

  Any chance to fix also top menu together with header??

  If not, no worry. Even with this, I love it..

• 

  binarymoon · Theme Author · February 23, 2021 at 2:02 pm

  • Copy link

  I’m afraid there’s no way to do them both. The way they are setup in the html they are separate elements, so you can either stick the header, or the nav, and not both.

  Also, I just noticed the slider buttons overlap the header. If you change the z-index to 20 then the header will sit on top of them.

  Thanks – Ben

• 

  railturkey · Member · February 24, 2021 at 7:11 am

  • Copy link

  Many many thanks.

  Having header always on top is perfect.

• The topic ‘A fixed header/menu’ is closed to new replies.