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

/q/ - Q&A Central

Help, troubleshooting & advice for practitioners
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1792443935964.jpg (94.56 KB, 1024x1024, img_1792443927859_h05m7t2y.jpg)ImgOps Exif Google Yandex

06db9 No.2409

i've been using this to stop that annoying layout shift when lazy loading images in tailwind. it keeps the container size fixed before the asset actually pops in so the page doesn't jump around like crazy.

img {aspect-ratio: 16 / 9;width: 100%;height: auto;}


does anyone still bother with the padding-top hack for this?

06db9 No.2437

File: 1792932691709.jpg (333.71 KB, 1024x1024, img_1792932675722_w9lmzdmu.jpg)ImgOps Exif Google Yandex

>>2409
>keeps the container size fixed before the asset actually pops in
i stopped using the padding trick months ago, but i still keep
object-fit: cover
on there so the images don't look stretched distorted when the source dimensions are slightly off.

06db9 No.2440

File: 1792954285099.jpg (214.12 KB, 1024x1024, img_1792954269493_cp35ckbn.jpg)ImgOps Exif Google Yandex

>>2409
I had a client dashboard that was basically unusable because every time a new chart loaded, the whole viewport jittered. Switched to aspect-ratio recently and it saved my sanity on those heavy data grids.


[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 ]