Jump to content

Making Custom Sidebar Navigation Responsive

Recommended Posts

Site URL: https://www.vernhippensteal.com

Hello,

I am using the following CSS for a custom sidebar navigation menu: 

#headerWrapper header#header {
    height: 100vh !important;
    padding: 15px !important; /* change to anything you want */
}
body.sidebar-position-left #headerWrapper {
    left: 0 !important;
    top: 0 !important;
}

#headerWrapper header#header {
    height: 100vh !important;
}
header#header {
    background: #402533;
}

 

What do I need to change or add so that the header does not take up 100vh on mobile?

 

One screenshot shows desktop, which I'm happy with. The other shows mobile, which I need to fix. Thank you!

Screen Shot 2020-10-16 at 12.37.40 PM.png

Screen Shot 2020-10-16 at 12.37.27 PM.png

Link to comment
  • Replies 0
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Posted Images

Create an account or sign in to comment

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

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.