Shopify themes, liquid, logos, and UX
Hello,
For the "How It Works" section, there are currently 3 columns, 2 rows on the desktop version. For the mobile version, I chose the "Grid" function. I am wondering what I can do to make them displayed in the same way as what it was in the desktop version (like 3 columns 2 rows, pictures on the first row, and text on the second rows. . Currently, the way it shows on the mobile looks messed up.
Here is my website: https://wowberrybites.myshopify.com/
Thanks!
hello @winnado11
please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.
@media screen and (max-width: 759px){
#shopify-section-1623276090444d7601 .custom-content__blocks {
grid-template-columns: auto auto auto;
}
#shopify-section-1623276090444d7601 .custom-content__item--one_third {
grid-column: unset;
}
#shopify-section-1623276090444d7601 .custom-content__text .custom-content__text-title{
font-size: 14px;
}
}
Hello @Kinjaldavra ,
Thank you for your help. I actually changed my mind and edited their location. Do you know how I can make them into one row on the desktop version? And 3 rows 2 colums - 2 items each row (1 image 1 text) on the mobile version?
Thanks in advance.
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