I’d like to reduce the padding slightly where each of the red lines are.
URL: https://www.soundshield.co.uk/products/sound-shield
Theme: Dawn
Any advice is greatly appreciated.
Topic summary
Reducing spacing in the product information section of a Shopify Dawn product page (URL provided), focusing on the vertical gaps highlighted in red.
-
Proposed change: Edit the theme’s CSS (Assets > base.css/style.css/theme.css) and add rules that reduce margins.
-
Targets and values: product title bottom margin (.5rem), product text and icon-with-text top margin (.5rem), and vertical margins (.5rem 0) for specific blocks (#shopify-block… and #price-template…). A result image shows tighter spacing.
-
Follow-up request: Make elements even closer together and guidance on which values to change.
-
Update: The helper advised setting all the added margin values to 0 for the tightest spacing.
-
Technical notes: “Margin” controls space outside an element; “rem” is relative to the root font size (0.5rem ≈ half the base font size). Lowering these values further (down to 0) decreases the gaps.
-
Outcome/Status: Actionable steps provided; user can set margins to 0 if more compression is needed. Thread appears ongoing with an offer for further review if 0 is insufficient.
1 Like
Hi @BraxtonEcom
Check this one.
From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
Find the theme that you want to edit and click on “Actions” and then “Edit code”.
In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
.product__title {
margin-bottom: .5rem;
}
.product__text, .product__info-container .icon-with-text {
margin-top: .5rem;
}
div#shopify-block-33d275e8-6898-441e-8f83-163b90ba576f,
div#price-template--16155726282918__main {
margin: .5rem 0;
}
And Save.
Result:
Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!
1 Like
Thank you so much.
Is there any way to make them slightly closer together?
Which values should I change?
Is there any way to make them slightly closer together?
Which values should I change?
You can make it all 0. If not then let me know I can check it again.
1 Like