Dears,
I’ve been looking for the solution to my problem for hours but everything I’ve tried doesn’t work.
On my homepage I would like to reduce the space between the heading of my Featured collections and the images below.
My url is : www.shkoonshop.com
Could you help me please?
Thank you!
Hey @Moujik ,
please note that the problem you are facing caused because of the product images that are too tall and are not centered. Fixing the images will resolve your problem.
HI @Moujik
This is Henry from PageFly - Landing Page Builder App
You can try this code by following these steps:
Step 1: Go to Online Store->Theme->Edit code.
Step 2: Search file component-card.css
Step 3: Paste the below code at bottom of the file → Save
.collection__title.title-wrapper, title-wrapper-with-link {
margin-bottom: 0 !important;
}
Hope that my solution works for you.
Best regards,
Henry | PageFly
Hey,
You can paste the following code to the bottom of your base.css file:
.collection__title.title-wrapper {
margin-bottom: -2rem;
}
Note that this is NOT the optimal solution, and the best solution is fixing the pictures, as we mentioned before.
Thank you so much!
I had to change the Image ratio in the Featured collection/Product card section and it reduced the blank space.
Another (last?) question :
This time, how could I add blank space between the bottom of my Instagram Feed app and the heading of my Featured collection ??
There is no change when I edit the Top padding.
Use the following code:
#rap__med__instagram {
margin-bottom: 2rem;
}
if we helped you please mark this reply as a solution!
Where should I add this code please?
Go to Online Store → Themes → Edit code, then go to the file called base.css and paste the code at bottom of it
Got it! It works! Thank you so much.