Shopify themes, liquid, logos, and UX
Hi,
I am trying to change my multi row section to look like the example attached.
How do I
1) extend the images to the left border
2) ensure there is no gap between the rows
3) raise the caption text higher up
Thanks.
Hello @avk9641
It is some CSS issue please apply the below CSS
.multi-row-section {
padding-left: 0;
margin-left: 0;
}
.multi-row-section .row {
display: flex;
margin: 0;
padding: 0;
}
.multi-row-section .row .image-container {
flex: 1;
margin: 0;
}
.multi-row-section .row .image-container img {
width: 100%;
}
.multi-row-section .caption-container {
position: relative;
top: -10px; /* Adjust as needed */
margin-bottom: 0;
}
I hope its useful for you if any issues please connect with us I will help resolve this issue
thanks
this code did not work. I was able to solve items 1 and 3, but there is still som visible space between the rows.
June brought summer energy to our community. Members jumped in with solutions, clicked ...
By JasonH Jun 5, 2025Learn 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, 2025