Jump to content

Change height/padding of sub-navigation in the mobile navigation

Recommended Posts

Add to Design > Custom CSS

div:not([data-folder]) div.header-menu-nav-item {
    margin-bottom: 30px;
}
[data-folder] div.container {
    margin-bottom: 50px !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 2 weeks later...
On 8/13/2022 at 11:22 PM, tuanphan said:

Add to Design > Custom CSS

div:not([data-folder]) div.header-menu-nav-item {
    margin-bottom: 30px;
}
[data-folder] div.container {
    margin-bottom: 50px !important;
}

 

Thanks so much for your response tuanphan, unfortunately this code is changing the spacing between menu elements, but I need to raise the entire sub-menu (folder link) up, I've attached images to better illustrate 🙂

Thanks for the help I really appreciate it

m.jpg

mm.jpg

Link to comment
On 8/22/2022 at 7:56 PM, calcal said:

My apologies, the site is https://cals.art  and the password is pump

Thanks again!

Add to Design > Custom CSS

[data-folder] .header-menu-nav-folder-content {
    justify-content: flex-start;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 1 year later...

Hi tuanphan,

I have learned a lot from your posts over the years!

Was wondering if this could be coded to justify (vertically) the menu items in the mobile menu?

something like this - 

/* TRYING TO GET THIS TO SPACE EVENLY on MOBILE MENU */

[data-folder] .header-menu-nav-folder-content {
    justify-content: space-evenly !important;
}

 

not  spacing evenly - just getting the default.

For reference, my site is

spstudios.com

(issue is when viewing in mobile or browser-window is smaller than 1400px wide)

Thanks, 'spstudiosdotcom'

Link to comment
On 10/10/2023 at 11:59 PM, spstudiosdotcom said:

Hi tuanphan,

I have learned a lot from your posts over the years!

Was wondering if this could be coded to justify (vertically) the menu items in the mobile menu?

something like this - 

/* TRYING TO GET THIS TO SPACE EVENLY on MOBILE MENU */

[data-folder] .header-menu-nav-folder-content {
    justify-content: space-evenly !important;
}

 

not  spacing evenly - just getting the default.

For reference, my site is

spstudios.com

(issue is when viewing in mobile or browser-window is smaller than 1400px wide)

Thanks, 'spstudiosdotcom'

Do you have an example or image of what your desired layout? I can imagine and help easier

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

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.