Thanks in advance!
I’m looking to move all of the words over to the left near the edge of the page. I’m looking to be able adjust it to my liking. Example shown below.
password: dc
Topic summary
A user wants to reposition the mobile menu text in the Dawn theme, specifically moving it to the left edge of the page with adjustable positioning.
Proposed Solutions:
Two developers provided CSS-based approaches:
- Solution 1: Add CSS to the
base.cssfile targeting.menu-drawer__menu-itemwith padding adjustments - Solution 2: Insert CSS code in the
theme.liquidfile (before the</body>tag) using padding properties to control menu item positioning
Both solutions involve:
- Accessing the theme code editor (Online Store → Themes → Edit Code)
- Implementing CSS padding modifications
- Adjusting pixel values to achieve desired alignment
The discussion remains open, awaiting the original poster’s feedback on whether either solution resolves their issue.
Add This css In edit Code > base.css File
.menu-drawer__menu-item {
padding: 1.1rem 1rem !important;
}
1 Like
Hello @MMast ,
I understand you are looking to move the mobile menu item to the left
You can move the mobile menu item using CSS code, you have to implement padding property in that section.
Please add the below-mentioned code for the desired change.
-
Go to Online Store → Themes → Click on three dots → Edit Code.
-
Now, Search and open theme.liquid file
-
Next add the mentioned code at the bottom of the theme.liquid file before tag and save.
[ Please feel free to change the pixel size of the padding property.]
Output →
I hope the code helps you.
Please share if you have any queries.
Thank you.
1 Like