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

Fixed menu in Brine templates


rschnell1

Question

Wondering if anyone has CSS code to make sure my navigation remains fixed at the top of the browser on PC, as well as mobile. I know there are some out there, but looking for any that have been vetted.

Thanks!

Edited by rschnell1
Initial Revision
Link to post
  • Answers 4
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

4 answers to this question

Recommended Posts

  • 0

I'm making the site 1800px max for now, so I put this:

.Header (this will fix it in place)

{position: fixed; (site width) width: 1800px; (not sure this is necessary) margin: 0; (so it's on top of all the layers) z-index: 1000;}

My site is actually not 1800px wide, because I have side padding, but however the SP code was written, it disregards the padding amount and it works with matching the header size here to the site width.

Now I got to figure out how to make it shrink down. Will post once I figure it out.

If your site stretches all the way across, you can put "width: 100%;"

Edited by Bill1965
Link to post
  • 0

@rschnell1 Add to Home > Design > Custom CSS


/* Fixed Top Header: Logo, Social Icon */
header.Header.Header--top {
   top: 0;
   left: 0;
   right: 0;
   z-index: 999;
   position: fixed;
}
/* Fixed Navigation */
header.Header.Header--bottom.Header--overlay {
   position: fixed;
   top: 70px;
   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...