d
Topic
Posts:
2
7 months ago

How to reduce rich text padding This post is outdated

My website https://charmingcuddles.com/ has a huge gap from the rich text at the top to the collection list. How do I reduce this? 

Using Pop Free theme.

Thanks

i
Replies
Cynthia D. Shopify Employee
Posts:
100
7 months ago

Hey there Derek!

Cynthia here, a Guru with Shopify :).

The best way to change that would be to make some changes to your theme's stylesheet - this way you can narrow down more specific areas without affecting the rest of the body. 

Go to your Admin->Online Store->Themes area, click the '...' icon, and go to Edit HTML/CSS.

Once you're there, go to Assets on the left, select timber.scss.liquid and scroll all the way down to the bottom, where you can add this piece of code:

 #shopify-section-rich-text.index-section {
  padding-bottom: 0px;
}

That should do the trick and decrease the space in between the rich text and your collection list.

If you have any questions, let me know!

Cynn | Guru @ Shopify

Cynn - support@shopify.com
Posts:
2
7 months ago

Okay thanks. I've still got quite a big gap, what else can I do? 

Cynthia D. Shopify Employee
Posts:
100
7 months ago

Hello Derek :)

There's some top padding in the collection list section there - you could remove that to reduce the gap even further!

Add this code to the bottom of your CSS stylesheet as well:

 #shopify-section-1487005628607.index-section {
   padding-top: 0px;
 }

Alternatively, if you wanted the same sort of padding to apply to all index sections (instead of just the padding in the bottom Rich Text and top Collection List), then you could replace everything we've added with this instead:

 .index-section {
  padding-bottom: 0px;
   padding-top: 0px;
}

And then adjust the padding accordingly if you need a little extra space :).

Let me know if you need anything else!

Cynn | Guru @ Shopify

Cynn - support@shopify.com