Hide a nav item from mobile version only

I have the code for removing from desktop and showing on mobile only but the reverse doesn't seem to work for hiding a nav item from mobile nav?

@media(max-width: 768px) {
.header-nav-item--folder:nth-of-type(2) {
    display: none !important;
}
}

2 hours ago, AltitudeDesign said:

I have the code for removing from desktop and showing on mobile only but the reverse doesn't seem to work for hiding a nav item from mobile nav?

 

@media(max-width: 768px) {
.header-nav-item--folder:nth-of-type(2) {
    display: none !important;
}
}

 

what is your site url so we can provide code for the template

9 hours ago, bangank36 said:

what is your site url so we can provide code for the template

Url is https://chancesschool.squarespace.com and pass is “preview” 

im on 7.1

thanks so much 

2 hours ago, AltitudeDesign said:

Url is https://chancesschool.squarespace.com and pass is “preview” 

im on 7.1

thanks so much 

.header-menu-nav-list [data-folder="root"] .header-menu-nav-folder-content > div:nth-child(1) {
  display: none !important;
}

You made a good site with blob animation

1 hour ago, bangank36 said:

.header-menu-nav-list [data-folder="root"] .header-menu-nav-folder-content > div:nth-child(1) {
  display: none !important;
}

You made a good site with blob animation

Thanks so much my friend

On 12/15/2020 at 6:06 PM, bangank36 said:

.header-menu-nav-list [data-folder="root"] .header-menu-nav-folder-content > div:nth-child(1) {
  display: none !important;
}

You made a good site with blob animation

Thanks so much! This worked!

Hello! Can you tell me what I need to do to hide a page in the desktop nav but have it show on mobile nav? I see some code above but don't know what it means or does! Cheers 🙂

On 5/25/2023 at 12:28 PM, CrumpetClubhouse said:

Hello! Can you tell me what I need to do to hide a page in the desktop nav but have it show on mobile nav? I see some code above but don't know what it means or does! Cheers 🙂

If you use SS 7.1, you can use this code

div.header-nav-item:nth-child(3) {
	display: none;
}

This will hide nav item 3 from left to right

Do similar with other items.