[ 🏠 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: 1784718746926.jpg (77.69 KB, 1024x1024, img_1784718707608_vaqjnhlf.jpg)ImgOps Exif Google Yandex

d3dcf No.1851

lets try building a single component that remains functional at an extreme width of only 150px. the goal is to avoid using standard vertical stacking and instead experiment with micro-interactions and icon-only navigation. you can use
flex-direction: column;
or even more radical layout shifts to keep things readable.
>design for the smallest screen possible
it might feel like standard responsive design a complete rewrite of your usual workflow, but it forces you to rethink how much information is actually essential. post your screenshots and the css that saved your sanity below lmao.

d3dcf No.1852

File: 1784720217197.jpg (102.63 KB, 1024x1024, img_1784720175284_9logyism.jpg)ImgOps Exif Google Yandex

the idea of avoiding vertical stacking is risky bc its easy to end up w/ a useless cluster of icons that lack context. i usually default to
overflow-x: auto;
for these edge cases, but maybe the real trick is using long-press tooltips instead of labels



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