Streaming live at 10am (PST)

How to span images in CSS Grid?

I’ve noticed a simple error.

Images won’t span cells in a grid when derived from a CMS.
They look fine on the canvas. But when published only span one cell.

Images spanning cells work fine when not derived from the CMS.

I’ve produced it here (link below): two grids. The top one CMS. The bottom one not.
Both look identical on the canvas. But when published, only the non-CMS image spans correctly.

Any thoughts?

thanks!


Here is my site Read-Only:
https://preview.webflow.com/preview/cms-grid-span-problem?utm_medium=preview_link&utm_source=designer&utm_content=cms-grid-span-problem&preview=e58ef274bbafd9b050dbceb922494be4&workflow=preview

HI @CharlesOJ images are working correctly based on your setting. This mean that even image from assets doesn’t work the way you thing. What I mean is that image from assets doesn’t follow grid either.

To make it work you need to set image width: 100%. In your current setting is set max-width only. Hope that make sense. Here is a short video related to your issue for better understanding why.

2 Likes

Thank you so much Stan!

You’ve nailed it. I spent so long wondering! I hope your response helps other Webflow learners master this issue. So helpful - hugely appreciated,
regards, Charles

1 Like

hi @CharlesOJ glad that helps. If you do not have further question related to your issue feel free to close your request as solved.

1 Like

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.