search

codyhouse / codyhouse-framework

A lightweight front-end framework for building accessible, bespoke interfaces.
https://codyhouse.co/
MIT License
1.16k stars 173 forks source link

aspect-ratio in v3 not working properly #102

Closed starchild closed 2 years ago

starchild commented 2 years ago

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.

claudia-romano commented 2 years ago

Hi there, you should give the aspect-ratio class to the image parent, in your example the <picture> element.

starchild commented 2 years ago

Thank you Claudia, I finally got this working with that and also moving the flex class to the a tag. You guys are great :)