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!
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024