How to remove padding on specific sections

Revail
Excursionist
30 0 13

Inked74373c3ac464de5b873d04d1e8fd0e9c_LI.jpg

Inkedcf5084a2e713fdcdd886b47de41df67f_LI.jpg

Hey, I am trying to remove the top padding from the sections above on my product and collections pages but when I edit the general code to change top padding from 60px  to 0px, it changes my homepage and footer as well making some sections look unnatural (attached examples below) Please help!

My store link is: www.revailco.com

8d6ed57bfca7f8177f991e71bae6a778.png2fe7cfe15a7630d1cc2a5be91d906cec.png

  

 

Replies 3 (3)
dmwwebartisan
Shopify Partner
9824 2236 3077

@Revail 

please try this code 1. Go to Online Store->Theme->Edit code 2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

@media screen and (min-width: 769.1px){
.template-collection .box { padding-top: 0px !important;}
.template-product .box { padding-top: 5px !important;}
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
Revail
Excursionist
30 0 13

Hey thanks , it works fine except for the fact that my footer is also affected.

ac1039e6c9861676424202271441a0ca.png

dmwwebartisan
Shopify Partner
9824 2236 3077

@Revail 

Please remove previous provided css class .

please try this code 1. Go to Online Store->Theme->Edit code 2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.

@media screen and (min-width: 769.1px){
.template-collection .collection-section .box { padding-top: 0!important;}
.template-product .product-single .box {padding-top: 5px!important;}
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →