Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

What css is needed to make the header sticky/fixed on Haute template?


wrachapman

Question

Hi guys it would be great if anyone knows how to make the navigation header fixed to the top of the screen on the Haute template?

The mobile header is already fixed but I cant manage to do it on desktop. I imagine there might be some simple css that I can add  🙏

Thanks!

Link to post
  • Answers 2
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Popular Posts

Hi there. Insert the following via Custom CSS: .Header { position: -webkit-sticky; position: sticky; top: 0; z-index: 890; } .collection-type-blog.view-list.tweak-blog-list-full-bleed:not

2 answers to this question

Recommended Posts

  • 0

Hi there. Insert the following via Custom CSS:

.Header {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 890;
}

.collection-type-blog.view-list.tweak-blog-list-full-bleed:not(.tweak-blog-list-filter-show) .Header, .collection-type-blog.view-list.tweak-blog-list-full-bleed.tweak-blog-list-filter-show:not(.has-active-filter) .Header, .collection-type-blog.view-item.tweak-blog-item-header-full-bleed .Header {
  position: fixed;
}

-Brandon

Edited by brandon

If a response helped you out, send a 'Like' 👍 (bottom-right) and/or 'Upvote' vote.jpg.c260784ece77aec852b0e3049c77a607.jpg (top-left)

Link to post
  • 0

Add to Home > Design > Custom CSS

header.Header {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 999;
}

 

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...