How do I get rid of this extra space right here?
Topic summary
A user encountered unwanted extra space at the top of their product pages on their Moroccan Plus store.
A support team member requested access to the site and provided a CSS-based solution:
- Navigate to the theme’s base.css or theme.css file
- Add custom CSS code targeting mobile screens (max-width: 600px) to adjust
.product-template .page-containermargin-top and.site-headertop positioning
Issue: The CSS fix successfully removed the space from product pages but unintentionally affected the homepage, displacing the logo from its original position.
Status: The discussion remains open with the user requesting a revised solution that fixes the product page spacing without impacting the homepage layout.
1 Like
Hello @omar_ab .
Our team is ready to help you.
Please share your website address and access password (if necessary) so that we can check and assist you.
- Here is the solution for you @omar_ab
- Please follow these steps:
- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press ‘Save’ to save it.
@media only screen and (max-width: 600px) {
.template-product .page-container {
margin-top: 77px !important;
}
.site-header {
top: 0 !important;
}
}
- Here is the result you will achieve:
- Please press ‘Like’ and mark it as ‘Solution’ if you find it helpful. Thank you.
1 Like
