Rich Text Section Padding – Symmetry Theme

Shopify Discussion
1

Hi community :slightly_smiling_face: Can anyone help me on the best way to remove some padding from the bottom of a rich text section in the symmetry theme?

URL – https://pantee.co.uk/?_ab=0&_fd=0&_sc=1

Current look –

Screenshot 2024-08-28 at 09.33.05.png
Screenshot 2024-08-28 at 09.33.05.png2880×502 76.9 KB

What we are aiming for (the bottom padding from the rich text section is smaller so the text sits closer to the product section below) –

Screenshot 2024-08-28 at 09.33.22.png
Screenshot 2024-08-28 at 09.33.22.png2164×350 177 KB

2

Hi :slightly_smiling_face: thank you for the help but unfortunately neither seemed to work for me, it really is tricky to remove padding in the Symmetry theme :disappointed_face: Would you be able to suggest anything else?

URL – https://pantee.co.uk/?_ab=0&_fd=0&_sc=1&preview_theme_id=144118972631

3

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

@media screen and (min-width: 990px) { .fully-spaced-row--small .lightly-spaced-row.button-row { text-align: end !important; margin-top: -40px; } div#shopify-section-template--18253912801495__featured_collection_A9YLwj { margin-top: -20px; } .fully-spaced-row--small h2.majortitle.in-content.h1 { font-size: 25px !important; font-weight: 500 !important; } .fully-spaced-row--small .subheading.subheading--over.lightish-spaced-row-above { font-size: 13px !important; margin-bottom: 11px !important; } .fully-spaced-row--small a.small-feature-link.button-row__btn { font-size: 15px !important; font-weight: 500 !important; } .fully-spaced-row--small { margin-bottom: 0 !important; } }

niraj_patel_0-1724837613123.png
niraj_patel_0-1724837613123.png1337×458 459 KB

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

4

Hi,

theme.scss.liquid or styles.css add custom css

CSS code example

.rich-text-section {
  padding-bottom: 0px;
}
5

Wow thank you so much for the incredible help with this css and theme @niraj_patel :blush: Very grateful!!

6

Glad to help you @emilyaugstudios . Have a good day :smiling_cat_with_heart_eyes:

7

Hello @emilyaugstudios

you can adjust the button with this CSS

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

@media screen and (min-width: 990px) { .fully-spaced-row--small .lightly-spaced-row.button-row { margin-top: -44px !important; } }

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.