aspect-ratio in v3 not working properly
starchild opened this issue · comments
Hi,
it seems the object-fit is not working correctly. It was fine with v1.
I don't think I'm doing it wrong?
<div class="grid gap-xs">
<div class="col-3@md col-3@sm flex">
<figure class="aspect-ratio-1:1 width-100%">
<a data-fancybox="photo-gallery" href="/url">
<picture>
<source srcset="/imagename.jpg.webp 1x" type="image/webp">
<source srcset="/imagename.jpg 1x" type="image/jpeg">
<img src="/imagename.jpg" loading="lazy" id="name" data-src="/imagename.jpg">
</picture>
</a>
</figure>
</div>
</div>
Thank you.
Hi there, you should give the aspect-ratio
class to the image parent, in your example the <picture>
element.
Thank you Claudia, I finally got this working with that and also moving the flex class to the a tag. You guys are great :)