Re: Remove bottom space between sections

Remove bottom space between sections

INKLY
Pathfinder
141 0 18

Hi does anyone know how I can remove the space between those two sections? For someone reason I can't seem to modify it within the theme? Thank you for your help! 

Store URL: https://servicedetable.com/?_ab=0&_fd=0&_sc=1&preview_theme_id=166100074824

INKLY_0-1730380731533.png

 

Replies 6 (6)

Moeed
Shopify Partner
7147 1932 2354

Hey @INKLY 

 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file

4) Add the following code in the bottom of the file above </body> tag

<style>
div#shopify-section-template--22341498503496__section_grid_Hh9pLU .grid {
    grid-template: repeat(4, 1fr) / repeat(12, 1fr);
}
</style>

RESULT:

Moeed_0-1730381139943.png

 

If I managed to help you then, don't forget to Like it and Mark it as Solution!

 

Best Regards,
Moeed

- Need a Shopify Specialist? Chat on WhatsApp

- Get a quick Shopify quote – Click here!

- Custom Design | Advanced Coding | Store Modifications


INKLY
Pathfinder
141 0 18

Hi @Moeed, Thank you for your answer. It did remove the space like I wanted but it also changed the image block (See screenshot). Do you know how to make it normal again?. 

INKLY_0-1730381876005.png

 

DaisyVo
Shopify Partner
4340 482 568

Hi @INKLY 

 

To complete your requests, please follow these steps:
  1. Go to Shopify Admin > Online Store > Theme > Customize > Theme Settings > Custom CSS https://prnt.sc/i8ljAMlHJUKl
  2. Paste the code provided into the Custom CSS section.

 

grid {
    grid-template: unset !important;
}

 

Here is the result: https://prnt.sc/VHZBd4tXiyWo
 
Hope this helps
 
Best,
 
Daisy
Please let us know if our reply is helpful by giving it a Like or marking it as a Solution!

Avada SEO & Image Optimizer - The #1 SEO solution
INKLY
Pathfinder
141 0 18

Hi @DaisyVo , Thank you for your answer. It did remove the space like I wanted but it also changed the image block (See screenshot). Do you know how to make it normal again?. 

INKLY_1-1730382018346.png

 

Made4uo-Ribe
Shopify Partner
10048 2388 3016

Hi @INKLY 

Try this one. 

  1. From your Shopify admin dashboard, click on "Online Store" and then "Themes"
  2. Find the theme that you want to edit and click on "Actions" and then "Edit code".
  3. In the "theme. Liquid" file. Find the </body> tag and paste the code below before the tag.

 

<style>
#grid--template--22341498503496__section_grid_Hh9pLU .grid__holder {
    position: relative;
    padding-bottom: 40%;
}
</style>

 

  • And Save.
  • Result:
  • Made4uoRibe_0-1730391133290.png

     

 Your Feedback Matters! Please mark the solution and give likes to posts that helped you. Your appreciation fuels our motivation to assist you better! 

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
INKLY
Pathfinder
141 0 18

Hi @Made4uo-Ribe, Thank you for your reply, unfortunately it did not make the space dissapear it just made the images smaller. See screenshots :

Before yoru code: 

INKLY_0-1730391503098.png

After your code: 

INKLY_1-1730391526262.png