Shopify themes, liquid, logos, and UX
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!
Solved! Go to the solution
This is an accepted solution.
Please share your store URL.
This is an accepted solution.
Please share your store URL.
Please share screenshot what do want!
Thanks!
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.
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!
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?
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;
}
}
Thank you for sending the updated code. Unfortunately, it did not do anything. Please see attached screenshot.
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;
}
}
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.
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.
Try this code
@media screen and (min-width: 769px){
#shopify-section-1596395525800 .box {
padding-top: 0px !important;
padding-bottom: 0px !important;
}
}
Thanks!
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;
}
}
Try this code
@media screen and (min-width: 769px){ #shopify-section-1596395525800 .box { padding-top: 0px !important; padding-bottom: 0px !important; } }
Thanks!
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!
Are you ready to take your business to the next level? Look no further than the latest ...
By SarahF_Shopify Apr 15, 2024We’re keeping the ball rolling to make sure you’re always ahead of the game. So buckle ...
By JasonH Apr 8, 2024Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024