Hello guys, how can I minimize the space here only in the mobile version
Topic summary
A Shopify store owner needed to reduce excessive white space on their mobile site, as shown in their screenshot.
Solutions Provided:
Two community members offered CSS-based fixes:
- Moeed’s approach: Add custom CSS code to the theme.liquid file, placed above the
</body>tag - DaisyVo’s approach: Use Shopify’s built-in Custom CSS section (Theme settings > Custom CSS) with a media query targeting screens under 768px width
Both solutions used CSS to adjust padding, margins, and button heights specifically for mobile devices using @media queries.
Outcome:
The issue was resolved. The original poster confirmed both solutions worked, though it’s unclear which method they ultimately implemented. Both helpers provided screenshots demonstrating the expected results after applying their respective code snippets.
1 Like
Hey @NikosBat
Follow these Steps:
-
Go to Online Store
-
Edit Code
-
Find theme.liquid file
-
Add the following code in the bottom of the file above tag
RESULT:
If I managed to help you then, don’t forget to Like it and Mark it as Solution!
Best Regards,
Moeed
1 Like
Hi @NikosBat
Could you please share the store link with us for further checking?
Looking forward to hearing from you soon. Thank you!
Best,
Daisy - Avada Support Team.
I hope you are well. You can follow our instructions below:
Step 1: Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
Step 2: From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/iDxwa8zBQ4Z-
Step 3: Copy the code below and paste it there
Here is the code for Step 3:
@media screen and (max-width; 768px){
.multicolumn > div {
padding: 0 !important;
}
button.slider-button {
height: 25px !important;
}
.multicolumn {
margin-top: -30px !important;
}
}
Please let me know if it works. Thank you!
Best,
Daisy - Avada Support Team.
1 Like
Thank you Moeed, that solved my problem
1 Like
Thank you DaisyVo, that solved my problem
Thank you for your reply. I’m glad to hear that the solution worked well for you. If you require any more help, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated.
You are welcome @NikosBat 