Solved

How can I decrease the white space between two sections on my Debutify theme?

Mukta_92
Shopify Partner
25 0 5

This is my Shopify developer store created by the Debutify theme.


Link - https://uniquestoreall.myshopify.com/
Psw - 1234


There are two "Image with text sections" before the footer section. I want to reduce the white space between those two sections. But unable to do it. If anyone does it for me by inspecting elements, I will be grateful to him.
Make sure perfect for mobile devices.

 

ScreenETFDRDshot_1.jpg

DebutifyThemeExpert
Accepted Solutions (2)

suyash1
Shopify Partner
9204 1146 1493

This is an accepted solution.

@Mukta_92 - please add this css to the very end of your theme.scss.css file, I will reduce spacing on homepage, change no. 20 as per your need

@media screen and (min-width: 769.1px){
.box {padding-top: 20px;    padding-bottom: 20px;}
}
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

Abdosamer
Shopify Partner
821 146 164

This is an accepted solution.

Hi @Mukta_92 , go to theme.scss.css and add the following code :

.box {
    padding-top: 20px !important;
    padding-bottom: 60px;
}

 

Buy me a Coffee
Email : abdelrahamansamer71@gmail.com
Chat on WhatsApp
Work samples

View solution in original post

Replies 10 (10)

suyash1
Shopify Partner
9204 1146 1493

This is an accepted solution.

@Mukta_92 - please add this css to the very end of your theme.scss.css file, I will reduce spacing on homepage, change no. 20 as per your need

@media screen and (min-width: 769.1px){
.box {padding-top: 20px;    padding-bottom: 20px;}
}
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

Abdosamer
Shopify Partner
821 146 164

This is an accepted solution.

Hi @Mukta_92 , go to theme.scss.css and add the following code :

.box {
    padding-top: 20px !important;
    padding-bottom: 60px;
}

 

Buy me a Coffee
Email : abdelrahamansamer71@gmail.com
Chat on WhatsApp
Work samples

PageFly-Oliver
Astronaut
878 190 171

Hi @Mukta_92 ,

 

You can try this code by following these steps:

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file theme.liquid

Step 3: Paste the below code at the bottom of the file -> Save

 

<style>
.box{
padding:10px 0 !important
}
</style>

 

 

Hope my solution works perfectly for you!

Best regards,

Oliver | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


PageFly - #1 Page Builder for Shopify merchants.


All features are available from Free plan. Live Chat Support is available 24/7.

Anshul_arora
Navigator
364 103 71

Hello @Mukta_92 ,

I understand you are looking to reduce the space between two section(Image with text sections)

Please follow the below mentioned steps to implement this change-:

1. Go to Online Store -> Themes-> click on 3 dots -> Edit code.

2. Search for the theme.liquid file and open it.

3. Now paste the below mentioned code at the bottom of this file before </body> tag

<style>

.box {
padding: 15px;
}

</style>

4. Save changes.

Output will look like this -: https://prnt.sc/b98HXsvyP1Hn

Please feel free to change the padding pixel size as per your requirements.

Kindly let me know if you need any assistance.

I look forward to your response.

 

Please remember to like and accept the solution to help other store owners.

For Shopify Design & Development | Custom Coding -Visit Here
cptstoa
New Member
8 0 0

Hello I can't seem to remove this space o n my home page with the all the answers from this thread ... 😕

 

Screenshot 2024-03-25 at 09.12.32.png

suyash1
Shopify Partner
9204 1146 1493

@cptstoa - please share this page link

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
cptstoa
New Member
8 0 0

Hi, thanks i already found the solution 😉

sharonasyam
Visitor
2 0 0

can you share how you solved it? I'm dealing with the same issue.

cptstoa
New Member
8 0 0

insert this in your them.liquid

 

}
.section + .section {
margin: 0 !important;
}

sharonasyam
Visitor
2 0 0

Tnx, but it didn't work

I think I'm having a different problem with the white space below the slideshow.