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

Fixed menu in Brine templates

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

Share this post


Link to post

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

Share this post


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;
}





Send me a message if you have any questions (free 10 minutes).

Don't send to forum message. I will check all questions via the link above

Share this post


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...