Reduce spacing between header & text and collapsable row

[NinoB97]

Hello guys how can i have less space between my header and text in the image shown below, also below the text u can see a collapsable row for information how do i also make the text closer to the row, it all should look sleek and alligned as u can imagine what i want, also keep in mind please that the image of my logo also connects / allign with the header & text, shortly said, i want the text and elements closer to each other and less spacing. Who can help me !

www.auraliving.nl

 

[BSSCommerce-HDL]

Hi @NinoB97,  Can you kindly share the details of your problem (link page) with us? We will check it and suggest you a solution if possible.

[BSSCommerce-B2B]

Hi @NinoB97 , 

I have reviewed your requirement, you just need to edit css script and the issue will be resolved.  You can follow my instructions! 

Step 1: Go to Admin -> Online store -> Theme > Edit code:

Step 2: Search for the file base.css. And add this code snippet to the end of the file.

.image-with-text__content.image-with-text__content--top.image-with-text__content--desktop-left.image-with-text__content--mobile-left.image-with-text__content--adapt.content-container.background-transparent {
    padding-bottom: 0 !important;
}

.image-with-text__text.rte.subtitle h5 {
    margin-bottom: -35px !important;
}

Step 3: Save your code and reload this page.

I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.

Have a nice day sir! 

[NinoB97]

didn't work brother i pasted the code as u said , the header is closer to the text but the text didnt go more down to the collapsable content row can u check it out and fix it for me? u can see how it looks like now on www.auraliving.nl and i will add a screenshot.

[BSSCommerce-HDL · Accepted solution]

Hi @NinoB97, 

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

Step 2: Search file theme.liquid

Step 3: Insert this code above </head> tag: 

<style>
  @media screen and (max-width: 749px) {
   .image-with-text__content {
     padding-top: 2rem !important;
     padding-bottom: 0 !important;
   }

   .collapsible-section-layout {
     padding: 0 !important;
   }
}
</style>

Here is result: 

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

[NinoB97]

this code worked perfectly bro thanks alot!