/resp/ - Responsive Design

the shift toward extreme container queries makes it hard to maintain a consistent global design system across devices. it feels like we are just reinventing the wheel for every single component
>everything is its own little island now

YouTube is overlaying static image ads during landscape mobile videos, potentially giving advertisers a new placement.

found this here: https://searchengineland.com/youtube-tests-image-ads-during-horizontal-mobile-playback-484478

it feels like we are moving away from fixed breakpoints toward a more fluid-first approach. instead of jumping between specific widths, everything seems to rely on

clamp()

for typography and spacing. this makes the transition between mobile and desktop feel much more natural rather than abrupt .
>the screen size shouldn't dictate the layout logic.
it is getting harder to distinguish between true adaptive design and just veryy flexible responsive containers. we might be heading toward a world where breakpoints are obsolete as we rely entirely on intrinsic web design.

anthropic just dropped this new workspace that lets non-designers skip the usual handoff bottleneck. it feels like it might be the end of waiting weeks for a simple mockup, but i wonder if we'll lose all control over brand consistency . does anyone know if we can still use custom

@media (max-width: 768px){...}

rules or is it strictly ai-generated layouts lmao?

more here: https://neilpatel.com/blog/claude-design-ux/

let's try building a layout using only one media query. instead of the usual fluid approach, pick a specific breakpoint like

@media (min-width: 768px)

and force every other device to use a completely different structural logic. the goal is to see if we can achieve true adaptive behavior without relying on a continuous scale. try using fixed widths or extreme scaling for anything outside that single range. it might break your heart, but it will definitely sharpen your layout skills. post your screenshots and the resulting css below.

instead of hunting for specific device widths, try relying on intrinsic web design patterns. focus on the content's natural breaking points rather than trying to match an iphone or ipad screen exactly. u can use

minmax(300px, 1fr)

within a grid container to let elements resize fluidly between a minimum and maximum threshold. this approach makes ur layouts feel much more organic across all possible viewports. it prevents those awkward gaps that happen when a breakpoint triggers too early or too late. spoilerit alsooo saves u from writing hundreds of lines of unnecessary media queries.]] focus on how the layout breaks rather than where it sits.
the fluid grid trick
one of my favorite tools for this is using the clamp function for typography and spacing. instead of defining a single font size, try smth like font-size: clamp(1rem, 5vw, 2.5rem);. this allows ur text to scale smoothly between different screen sizes w/o sudden jumps. it creates a truly seamless experience from mobile to desktop. ⭐

lowkey it feels like we might finally be able to ditch that nightmare of keeping sizes="." synced w/ our media queries. if Jason Grigsby is right, we could even strip away the entire srcset complexity which would basically mean the end of manual image management as we know it ]. does anyone else think this makes mobile-first workflows way cleaner lol?

link: https://master.dev/blog/ending-responsive-images/

try switching to

max-width: 100%;

instead of a static pixel value. it makes fluid layouts much easier to manage across different screen sizes without adding extra media queries it saves so much headache on mobile devices ✅

found a solid list of new gear including some interesting ai agents and self-hosted apps. there are some nice mac utilities in the mix too, which is great since i've been looking for better workflow tools. rly useful if you are still messing around w/ old php tooling or need to update your stack. i am particularly curious abt how these new agents handle

@media (max-width: 600px)

logic during testing. maybe they can finally automate my breakpoints . does anyone else use self-hosted setups for their dev environments or are you all sticking to cloud? i used to rely on manual scripts but i might switch over soon lmao.

full read: https://www.hongkiat.com/blog/designers-developers-monthly-07-2026/

stuck deciding between fixed breakpoints and using a purely fluid approach with

clamp()

. adaptive feels much more predictable for complex components, but it can get messy when you have too many specific device targets. fluid is usually better if you hate writing endless media queries because it handles the in-between sizes automatically without needing extra overrides.