Please help me with this
Topic summary
A user seeks to remove excess padding from a pop-up block size chart on their Shopify store, sharing a screenshot showing the spacing issue.
Two solutions provided:
-
Moeed’s approach: Add custom CSS code to the
theme.liquidfile (above the</body>tag) to adjust spacing. -
GTLOfficial’s approach: Modify
section-main-product.cssby adding CSS rules targeting.product-popup-modal__buttonand.product__info-containerto reduce minimum height and margins.
Follow-up request:
The original poster asks if the size chart can be displayed on the same line as the “Size” label. Moeed responds that this isn’t possible with CSS alone since they are separate blocks, suggesting a structural limitation.
Status: Partially resolved—padding issue addressed, but inline alignment request remains unresolved without deeper theme modifications.
1 Like
Hey @Senku
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 solve your problem then, don’t forget to Like it and Mark it as Solution!
Best Regards,
Moeed
Hello @Senku
Go to online store ----> themes ----> actions ----> edit code ----> assets —> section-main-product.css
add this code at the end of the file and save.
.product-popup-modal__button {
min-height: 0rem !important;
}
.product__info-container > * + * {
margin: 5px !important;
}
result
If this was helpful, hit the like button and accept the solution.
Thanks
thank you, can you help me make it on the same line as the Size
1 Like
They are two different block and by CSS only it won’t be possible.
Best,
Moeed
1 Like