Reduce White Space Between Elements On Homepage (Brooklyn Theme)

[StoreHelpNeeded]

Hello there!

Could anybody please help me with the code required to reduce the white space between sections/elements on the homepage of my Brooklyn theme? I want the white space between all sections shrunk by half.

Thank you for your support!

[Litos]

Hi @StoreHelpNeeded,

Go to Assets > theme.scss.liquid and paste this at the bottom of the file:

/*================ code for desktop ================*/
.index-sections .shopify-section {
	margin-top: 45px !important; 
}
@media screen and (max-width: 768px) {
	/*================ code for mobile ================*/
    .index-sections .shopify-section {
		margin-top: 25px !important; 
	} 
}

Hope it helps!

[PageFly-Noah]

Hi @StoreHelpNeeded 

This is Noah from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the </head> to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the </head>

<style>
.index-sections .shopify-section {
margin-top: 15px;
}
</style>

This is reduced half of the current spacing now

Hope this can help you solve the issue 

Best regards,

Noah | PageFly