remove gap between 'icon with text' blocks product page

Topic summary

A user seeks to reduce excessive vertical spacing between icon-with-text blocks on their product page (Dawn theme, alexandrawestbrook.com).

Problem: Large gaps appear between icon elements, as shown in the provided screenshot.

Solution provided:

  • Add custom CSS to the end of the base.css file
  • The code targets .icon-with-text__item elements and reduces bottom margin to 8px
  • Also adjusts spacing for product info container elements to 1.5rem
  • A before/after screenshot demonstrates the reduced spacing

Status: Solution offered but not yet confirmed as implemented or tested by the original poster.

Summarized with AI on October 29. AI used: claude-sonnet-4-5-20250929.

hello, i want to reduce the gap of my icon with text on my product page, as there is currently a big gap:

website is www.alexandrawestbrook.com , theme is dawn

Paste the following code in the end of base.css file.

li.icon-with-text__item {
    margin-bottom: 8px !important;
}
.product__info-container .product-form, .product__info-container .product__description, .product__info-container .icon-with-text {
    margin: 1.5rem 0 !important;
}

Results: