Solved

How to reduce vertical spacing between two sections (Dawn 2.0)

hsellak
New Member
9 0 0

Hi all,

I noticed a huge vertical spacing between two consecutive Featured Products blocks! How I can reduce that and any spacing between consecutive sections?

Thanks.

Accepted Solution (1)
suyash1
Shopify Partner
9368 1168 1505

This is an accepted solution.

@hsellak- ok, lets put it in media query, remove those lines and add this

@media screen and (min-width:1025px){
#shopify-section-template--14152804401393__featured_products{margin-top: 0rem;}

#shopify-section-template--14152804401393__featured_products .title-wrapper-with-link
{margin: 0rem 0 3rem;}
}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video using AI

View solution in original post

Replies 6 (6)

suyash1
Shopify Partner
9368 1168 1505

@hsellak- please share site URL

To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video using AI

Zworthkey
Shopify Partner
5581 642 1574

Hii, @hsellak 
Kindly share your store URL so,
I can solve it perfectly.
Thank You.

hsellak
New Member
9 0 0

@suyash1 @Zworthkey : I apologise for the delayed reply. You'll notice some spacing above "Featured Products" (title), slightly better spacing above "Featured Collection".

Can you please help with these and in general how I can modify the spacing between the different sections.

Thanks.

suyash1
Shopify Partner
9368 1168 1505

@hsellak- add this css to the very end of your base.css file and check

#shopify-section-template--14152804401393__featured_products{margin-top: 0rem;}

#shopify-section-template--14152804401393__featured_products .title-wrapper-with-link
{margin: 0rem 0 3rem;}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video using AI
hsellak
New Member
9 0 0

@suyash1  Hi Suyash, thanks this is working but there's one issue: this is affection the mobile display as I forgot to mention that the mobile version of store was looking good. How to limit this change to only Desktop.

Thanks.

suyash1
Shopify Partner
9368 1168 1505

This is an accepted solution.

@hsellak- ok, lets put it in media query, remove those lines and add this

@media screen and (min-width:1025px){
#shopify-section-template--14152804401393__featured_products{margin-top: 0rem;}

#shopify-section-template--14152804401393__featured_products .title-wrapper-with-link
{margin: 0rem 0 3rem;}
}
To build shopify pages use pagefly
You are welcome to contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
Paranormal story video using AI