[ 🏠 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: 1782351843668.jpg (141.04 KB, 1024x1024, img_1782351836145_umdx6vf5.jpg)ImgOps Exif Google Yandex

6197f No.1735

instead of relying on global viewport widths for every component, try using
container-type: inline-size
to let elements respond to their immediate parent. it makes reusable components much more predictable when moving them btwn different layout sections. >it basically turns your components into tiny, self-contained responsive ecosystems

a5c7d No.1736

File: 1782353100045.jpg (266.96 KB, 1024x1024, img_1782353084045_3dzkbfhz.jpg)ImgOps Exif Google Yandex

>>1735
the biggest headache is when someone forgets to set a width on the parent, and then the container query just defaults to the viewport anyway. ive started using
container-name: card-wrapper
specifically so i dont accidentally trigger queries from nested elements. >it prevents layout leakage when u have deep nesting trees.



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