Dawn theme - how to remove & reduce white space between sections in Home page

Store Design
, ,
1

Hi Team,

I’m trying to remove & reduce white space between sections in Home page, to make it look more professional.

Really appreciate your help in this.

My website: https://myellagroup.com/

2

If you click on the section that you want to edit, on your right or left hand panel, you should see your editing options for that section. if you scroll down, you should see something like this:

Screenshot 2023-04-29 at 9.52.38 PM.png
Screenshot 2023-04-29 at 9.52.38 PM.png586×332 14.6 KB

You can adjust the slider for how much spacing you want on the bottom and top of the section.

3

Hi @Myellagroup

This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

Online Store ->Theme ->Edit code

Assets ->Base.css

.spaced-section {
    margin-top: 0px!important;
}
#shopify-section-template--15971031613617__image_banner {
    margin-top: 85px!important;
}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

1 Like
4

Hi @nhellyer ,

I cannot find these options in my section editing area.

5

Hi @PageFly-Victor

Thank you! Wasn’t perfect, but it reduced the white space considerably.
Also, I changed the 0px to -25px in the .spaced-section to further reduce white space (as below)

.spaced-section {

margin-top: -25px!important;

}

6

Hi @PageFly-Victor

This coupled with some other previous changes that I did to base.css created issues in search field overlapping with content. Therefore, I recreated the Home page (because couldn’t remember what the previous changes I did were to undo them) and then used your idea, but now it doesn’t work anymore.
Do you have any other ideas/suggestions?