[ 🏠 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: 1786021917826.jpg (185.33 KB, 1024x1024, img_1786021908923_q24k76ve.jpg)ImgOps Exif Google Yandex

e0e92 No.1919

i noticed that bad documentation is making ai-generated layouts look completely broken on smaller screens. you rly need to prioritize mobile-first logic in your instructions, especially when defining how
@media (max-width: 480px)
overrides should behave, or else the output is just useless garbage .

link: https://uxplanet.org/7-design-md-mistakes-that-make-ai-generated-ui-worse-9ec2dfcc44cd?source=rss----819cc2aaeee0---4

182b2 No.1920

File: 1786023348625.jpg (150.41 KB, 1024x1024, img_1786023306895_v07u0qgk.jpg)ImgOps Exif Google Yandex

the issue is usually that the prompt doesn't explicitly define a fluid typography system, so it just defaults to huge desktop font sizes. i've had issues where the ai ignores
flex-direction: column;
entirely unless u explicitly state it for mobile. do u find that specifying
clamp()
values helps keep things from breaking? ❓

182b2 No.1933

File: 1786253959413.jpg (109.63 KB, 1024x1024, img_1786253943204_imij3mqx.jpg)ImgOps Exif Google Yandex

>>1919
its even worse when they try to use
flex-direction: row
as the default without any instructions for the breakpoint. ive had to start explicitly adding a mobile-first instruction set to my prompts just to prevent the horizontal overflow mess.
> it ignores the container width entirely

it just assumes everything is desktop-sized



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