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

How do I keep the top navigation visible and fixed

Question

My navigation scrolls of the screen on all of my pages.  Is there something that I can do to make it stick at the top?

Thanks!

David

Share this post


Link to post

7 answers to this question

Recommended Posts

  • 0

I literally up until JUST NOW had the same issue. I was on with support and they couldn't figure it out so she said she would research and email me. So, the mail said to add at least 2 pages to the main index page. I didn't know what she meant by an index page so I tried adding to the main navigation and it worked!

Share this post


Link to post
  • 0
5 hours ago, Dangercapone said:

The downside is the page names end up in  the navigation which is what I don't want.

 

Thanks for your reply, I appreciate it. I'll try that. I have multiple "pages" on several pages - what's another page or three. 🙂

Share this post


Link to post
  • 0

I was able to have my header navigation be fixed by applying this custom CSS:

.Header.Header--top {
	background: black;
  	margin-top: -1rem;
  	position: fixed;
  	top: 0px;
  	z-index:1000;
  	width:100%;
  	box-shadow: 0px 2px 3px rgba(0,0,0,0.1)
}
div.Header-inner.Header-inner--top {
  	margin-bottom: -1rem;
}

Based on your template, your class selector (.Header.Header--top) might be different from mine. You can remove

margin-top: -1rem;

and

div.Header-inner.Header-inner--top {
  	margin-bottom: -1rem;
}

I added those lines of CSS because I wanted my navigation header to be thinner.

Share this post


Link to post
  • 0
13 hours ago, whoyouapp said:

I was able to have my header navigation be fixed by applying this custom CSS:


.Header.Header--top {
	background: black;
  	margin-top: -1rem;
  	position: fixed;
  	top: 0px;
  	z-index:1000;
  	width:100%;
  	box-shadow: 0px 2px 3px rgba(0,0,0,0.1)
}
div.Header-inner.Header-inner--top {
  	margin-bottom: -1rem;
}

Based on your template, your class selector (.Header.Header--top) might be different from mine. You can remove


margin-top: -1rem;

and


div.Header-inner.Header-inner--top {
  	margin-bottom: -1rem;
}

I added those lines of CSS because I wanted my navigation header to be thinner.

Thanks!

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