How can I add space between homepage sections?

Store Design
1

I would like to add spacing between the home page image and the section underneath it , this is what it looks like now:

Screen Shot 2021-08-11 at 12.13.41 am.png
Screen Shot 2021-08-11 at 12.13.41 am.png1120Ă—331 44.1 KB

my store is heylushskin.com

2

Hi, you can add “padding” to the bottom of your main image by doing this:

STEP 1: add this ( you can play around with different values in the “75px”):

.shopify-section-1624775942dd8b9b47 {
	margin-bottom: 75px; 
}

to your “theme.css” file in your “assets” folder:

Done. That should do it. Good luck

3

Hi @carla27 .

Thank you for your message.

I really enjoyed taking a look at your store, I love the professional design and you seem to have an awesome product here. That said, It looks like @bdowling beat me to it with this suggestion! But, I would be happy to provide you with some other possibilities for this.

If you are not comfortable with coding and are using a Shopify theme, this may be something our themes team can help you out with directly. So, if your theme was built by us and you have available design time, I would suggest visiting our Help Center here and logging in to your account to create a support request. We’d be happy to continue assisting you through live chat, email, or callback. Once you reach a live support member and explain your request they will be able to double-check with our themes team if this customization is one they can help you out with.

If you are using a third-party theme, you may want to reach out to your third-party provider, however, third-party theme developers will not always provide customization support. You could always reach out to a local developer or hire a Shopify Expert.

I hope this additional suggestion helps you out, please feel free to reach back out here if you have any questions at all!

4

hello @bdowling now my website is all jumbled could you please fix this whoops!

5

it is fixed now but the spacing is not working no matter what px i put in @bdowling

6

Strange… it’s working on my end. I’ll double check tomorrow.

7

Hi, it does look like the color is off with my suggestion.

To fix this, replace the previous code you added with this (again you can use another value for “100px” – for example “75px” for smaller padding):

#Section-1628609276d845b7c5 {
    padding-top: 100px;
}

I hope that solves the problem. Good luck

8

Also if you want the elements in the box to remain vertically centered (with my most recent suggestion they will appear towards the bottom of the green container) add a “padding-bottom: 100px;” under the “padding-top: 100px;” line (make sure to use the same “px” value for the top and bottom if your goal is to vertically center them).