Shopify themes, liquid, logos, and UX
Can anyone tell me how to reduce the size of these 4 images and the width of the text so that it doesn't stretch so much in larger resolutions?
Hi @pimpãoclothing,
Could you please share your Store URL and password (if applicable) so that I can review it and provide you with the appropriate solution code?
Looking forward to your response.
Thanks!
You are most welcome.
In order to make the 4 grid image small and the width of the text then follow these steps.
Go to Shopify Admin > Online Store > Edit Code > base.css
Go to end of base.css file and paste the following code.
#shopify-section-template--24835640394052__image_text_grid_N4TnFL .grid-image img {
width: 300px !important;
max-width: 100% !important;
}
.image-grid{
grid-template-columns: 0.7fr 1fr !important;
}
.grid-content{
gap: 0px !important;
}
Results:
But now this happens on smaller resolution (from 1600px to 999px)
Learn how to build powerful custom workflows in Shopify Flow with expert guidance from ...
By Jacqui May 7, 2025Did You Know? May is named after Maia, the Roman goddess of growth and flourishing! ...
By JasonH May 2, 2025Discover opportunities to improve SEO with new guidance available from Shopify’s growth...
By Jacqui May 1, 2025