Changing width od dropdown menu

Highlighted
Tourist
7 0 1

Hello Community,

I need to change the width of the grey background box of my shop dropdown menu in order to see all 4 shop categoriers next to each other in a specific resolution range.

https://diehautfee.de/ (Shop Dropdown Menu)

In Detail that would be between width 760 px and 1630 px where i want the grey box to have a width of 760 px.

Another option would be to set the menu to a width of 80% of the screen width between 1024 px and 160 px. This should also do it for smaller resolutions.

I hope someone can help out.

 

Regards, Tobi

 

 

 

 

0 Likes
Highlighted

Hello
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

a.site-nav__link.site-nav__child-link {
    padding: 9px 18px 0px 4px;
}
.site-nav__childlist {
    padding: 6px 6px;
}
Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Tourist
7 0 1

Thanks for the quick answer. 

i only can't see a difference to before.

Code is inserted.

Regards

0 Likes
Highlighted

your collections will be on same line..

what differences you are seeing?

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Highlighted
Tourist
7 0 1

Hi,

it's probably best to show it with a screenshot:

HF-Screenshot-201022.jpg

 

I simulated with browser window a resolution of around width 1250 px. Down to a width of 1200 px i need to see the collections in line/next to each other.

Right now the "break" is at browser window width of around 1520 px (because then the grey background box is getting to small in width to display the collections in line).

As i understand i need to set a higher width (approx. 150% or by increasing padding) of the background box for resolutions lower then 1520 px to solve this.

 

Regards, Tobi

0 Likes
Highlighted
Tourist
7 0 1

Cant' anybody help?

0 Likes