[ 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: 1790689695128.jpg (154.05 KB, 1024x1024, img_1790689687032_ufusicrj.jpg)ImgOps Exif Google Yandex

b7231 No.2150

stop using width: 100% for everything and just let it break your layout. if you don't set a max-width it just stretches into infinity on ultra-wide monitors. honestly css grid handles this way better with auto-fit.
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr))

b7231 No.2174

>>2150
the 250px floor is a bit arbitrary for mobile though. i've seen it cause weird tiny columns on smaller screens if you don't wrap things in a container with padding. also people still love using flexbox for simple rows because they're too lazy to learn grid properties. just use object-fit: cover and call it a day. it saves me from the stretching mess most of the time. what's your default minmax value when you're working on mobile-first layouts? i find that 250px feels way too wide for some small viewport widths.


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