Jump to content

Making Custom Sidebar Navigation Responsive

Recommended Posts

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


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


This topic is now archived and is closed to further replies.

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