I cannot seem to figure out how to decrease the padding below the header, and above the next section, on the mobile portion only. The giant white space shown below. I have seen other threads with different code snippets, but nothing really seems to apply to my situation exactly.
Topic summary
A Shopify user encountered excessive white space (padding) between the header and the next section on mobile devices.
Solution Provided:
- Add custom CSS code to the theme.liquid file, placed above the
</body>tag - The code targets mobile-specific padding adjustments
- Initial implementation successfully resolved the issue
Current Status:
- The white space has reappeared after the user removed an image banner
- The discussion remains open with an unanswered question about whether the original code needs modification to account for the banner removal
The solution involved editing theme files directly, which requires access to Shopify’s code editor. Screenshots were shared to illustrate both the problem and the initial successful result.
1 Like
Hey @thecozycrewbflo
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
1 Like
Hey @thecozycrewbflo
I have edited my reply, please refresh the page and check it out again! 
Best Regards,
Moeed
1 Like
Thank you so much, it worked!
1 Like
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.
After removing that image banner, the white space appears to be back. Do I need to change the coding from before?