Hello,
I have the Canopy theme and would like to expand the sub menu so that words are all on one line instead of 2. Please help.
Please hover - Locations > Redwood City, CA (it is on 2 lines)
Topic summary
A Canopy theme user needed help expanding their submenu width to prevent text from wrapping onto multiple lines, specifically for a “Locations > Redwood City, CA” menu item.
Solution provided:
- Navigate to Shopify admin → Online Store → Themes
- Click Actions → Edit code on the desired theme
- Open the
base.cssfile in the Assets folder - Add the following CSS at the bottom:
.main-nav .nav-item.drop-norm .nav-sub .nav-sub-list {
width: 200px !important;
}
- Save the file
Result: The original submenu width was 190px; adding 10px+ resolved the wrapping issue. The user confirmed the solution worked perfectly, and the issue is now resolved.
1 Like
Hi @cid_gk ,
I just want to clarify, you like to expand? or just lesser the font size of that specific location? so it wont be 2lines.
Expand, please.
1 Like
Okay, Try this one.
- From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
- Find the theme that you want to edit and click on “Actions” and then “Edit code”.
- In the “Assets” folder, click on “base.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
- And Save.
.main-nav .nav-item.drop-norm .sub-nav .sub-nav-list {
width: 200px !important;
}
Result:
The original size is 190px i just add +10px.
I hope it help.
1 Like
This worked beautifully, thank you so much!
1 Like
Your Welcome! 