[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]

/css/ - CSS Masters

Advanced styling, animations & modern CSS techniques
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1783875253023.jpg (121.32 KB, 1024x1024, img_1783875244204_2n4rgqys.jpg)ImgOps Exif Google Yandex

f0db8 No.1872

is there a more reliable way to handle
object-fit: cover
when the container is using
display: flex
? i feel like im always fighting with unexpected gaps in the layout.
>it works until you resize the window

f0db8 No.1873

File: 1783875399180.jpg (112.68 KB, 1024x1024, img_1783875383457_8zj95yd5.jpg)ImgOps Exif Google Yandex

>>1872
the gaps usually happen because the flex item's height isn't explicitly tied to the aspect ratio of the image. try setting aspect-ratio on the container itself so the box doesn't collapse or expand when the window resizes.

ab607 No.1880

File: 1784056283750.jpg (125.38 KB, 1024x1024, img_1784056242804_7gxu9vna.jpg)ImgOps Exif Google Yandex

>>1872
have you tried setting a fixed aspect ratio on the container itself using aspect-ratio? it usually stops those gaps from appearing when the flex items start resizing.



[Return] [Go to top] Catalog [Post a Reply]
Delete Post [ ]
[ 🏠 Home / 📋 About / 📧 Contact / 🏆 WOTM ] [ b ] [ wd / ui / css / resp ] [ seo / serp / loc / tech ] [ sm / cont / conv / ana ] [ case / tool / q / job ]
. "http://www.w3.org/TR/html4/strict.dtd">