How can I remove space between sections in Debutify theme?

Store Design
1

Hi,

I want to eliminate the space between the images and buy now button, which I put there via a code. How may I be able to achieve this? Please see attached screenshot for more info. I am using Debutify theme.

Thank You!

1 Like
2

@TheSandK

Please share your store URL.

1 Like
3

Thank you for your reply. My store link is www.roquisite.com

4

@TheSandK

Please share screenshot what do want!

Thanks!

5

I want to eliminate the space between the images and buy now button, which I put there via a code. Please see attached screenshot for more info. I am using Debutify theme.

Screen Shot 2021-09-20 at 12.05.11 PM.png
Screen Shot 2021-09-20 at 12.05.11 PM.png1216Ă—375 128 KB

6

@TheSandK

Please add the following code at the bottom of your assets/theme.scss.liquid file.

@media screen and (min-width: 769px){
#shopify-section-1596395525800 .box {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

#shopify-section-1596395525800 .grid--spacer>.grid__item {
    margin-bottom: 0px;
}

}

Thanks!

1 Like
7

Thank you so much. The code worked perfectly; however, there is still minor space. I was wondering if there was a way to further decrease the spacing just slightly?

8

@TheSandK

Please try following code

@media screen and (min-width: 769px){
#shopify-section-1596395525800 .box {
    padding-top: 0px !important;
    padding-bottom: 35px !important;
}

#shopify-section-1596395525800 .grid--spacer>.grid__item {
    margin-bottom: 0px;
}

}
1 Like
9

Thank you for sending the updated code. Unfortunately, it did not do anything. Please see attached screenshot.

Screen Shot 2021-09-22 at 11.52.15 AM.png
Screen Shot 2021-09-22 at 11.52.15 AM.png1232Ă—502 377 KB

10

@TheSandK

Please add the following code at the bottom of your assets/theme.scss.liquid file.

@media screen and (min-width: 769px){
#section-1632011054f85c1c45 .box {
    padding-top: 0px !important;
    padding-bottom: 30px !important;
}
}
11

Thank you for sending another code. Unfortunately, this also did not work. The gap still remains between the Shop Now CTA and the images above.

12

Hi,

I was wondering if you had a chance to see why the code did not work as the space between the images and “Shop Now” button is still showing.

Thank you for your help.

1 Like
13

@TheSandK

Try this code

@media screen and (min-width: 769px){
#shopify-section-1596395525800 .box {
   padding-top: 0px !important;
    padding-bottom: 0px !important;
}
}

Thanks!

14

Thank you for sending the updated code. However, it created more space instead.

Only this code worked but still has some space in between if you see the website

@media screen and (min-width: 769px){

#section-1632011054f85c1c45 .box {

padding-top: 0px !important;

padding-bottom: 30px !important;

}

}

1 Like
15

@TheSandK

Try this code

@media screen and (min-width: 769px){ #shopify-section-1596395525800 .box { padding-top: 0px !important; padding-bottom: 0px !important; } }

Thanks!

16

No, still no luck. Same thing, it created more space instead. Would it be possible for you to see my store’s theme.scss.liquid file and see why the space is not being eliminated?

Thank you for all your help!