Solved

Dawn Theme - drop down menu don't have scroll only on desktop

Caneprint
Excursionist
15 1 6

Hello.

My web don't have scroll on desktop (drop down menu)

2 hours I'm playing with CSS or media code in theme, base files..

It's doesn't works.. How I can change this overflow?

Thanks

 

Caneprint_0-1685365359918.png

 

 

 

 

Accepted Solutions (2)
Akibhusen
Shopify Partner
715 121 147

This is an accepted solution.

Add the below line of CSS code at the end of your base.css file. 

 

body .js details>.header__submenu{
max-height:60vh;
overflow: auto;
}

 

let me know if you have any issue with this.

View solution in original post

Caneprint
Excursionist
15 1 6

This is an accepted solution.

But I use this one, CSS without body, and it's working!!!! Thank you!

 

.header__submenu {
max-height: 60vh;
overflow: auto;
}

View solution in original post

Replies 12 (12)

Akibhusen
Shopify Partner
715 121 147

Could you please share your store URL? so, I can check and guide you to solve the issue.

Caneprint
Excursionist
15 1 6

Yes,sure.

https://caneprint.com/

password 12345

 

Thanks

Akibhusen
Shopify Partner
715 121 147

The website is scrolling well when the dropdown menu is open on the desktop. What issue you are facing?

 

It's working fine on my end.

Caneprint
Excursionist
15 1 6

try to click on "motorcycles"

I don't have scroll on desktop for drop down menu

Caneprint_0-1685367992624.png

 

Caneprint
Excursionist
15 1 6

This code I use before on my custom theme .

{
display: inline-block;
max-height: 40px;
max-width: 110px;
overflow: hidden;
}

but on DOWN I need something other

 

Akibhusen
Shopify Partner
715 121 147

So, do you want a scroll bar in the menu dropdown? correct me if I am wrong.

 

and still, If I don't get you let's connect and discuss 

Akibhusen
Shopify Partner
715 121 147

Akibhusen_0-1685368871198.png

Would you like to display like this?

Caneprint
Excursionist
15 1 6

YES!!!!:)

Caneprint
Excursionist
15 1 6

Yes, your right.

I want like this:

Caneprint_0-1685369066097.png

 

 

Akibhusen
Shopify Partner
715 121 147

This is an accepted solution.

Add the below line of CSS code at the end of your base.css file. 

 

body .js details>.header__submenu{
max-height:60vh;
overflow: auto;
}

 

let me know if you have any issue with this.

Caneprint
Excursionist
15 1 6

It's not working

 

Caneprint_0-1685370244943.png

 

Caneprint
Excursionist
15 1 6

This is an accepted solution.

But I use this one, CSS without body, and it's working!!!! Thank you!

 

.header__submenu {
max-height: 60vh;
overflow: auto;
}