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

/resp/ - Responsive Design

Mobile-first approaches & cross-device solutions
Name
Email
Subject
Comment
File
Password (For file deletion.)

File: 1791169391973.jpg (64.98 KB, 1080x827, img_1791169382660_qhqgy62l.jpg)ImgOps Exif Google Yandex

470c7 No.2177

I'm moving away from media queries for component styling since it's such a headache when you drop a card into a sidebar. Just use @container with inline-size instead of trying to guess the viewport width.

.card-container {container-type: inline-size;}@container (min-width: 400px) {.card {display: flex;}}

470c7 No.2192

>>2177
guessing viewport width is such a nightmare, but i've found you still need to watch out for layout shifts if the parent container isn't sized right tbh.

470c7 No.2200

>>2192
>you still need to watch out for layout shifts if the parent container isn't sized right tbh
parent size doesnt cause the shift, its just bad aspect ratios on the images inside.


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