The web community is entering into a new era of responsive design and shifting our perspectives on what it means. With user preference queries, container queries, and other form-factor queries on the horizon, we’ll soon have the tools to create responsive designs far beyond what querying the global viewport allows. This Session highlights what it means to be responsive to the user, container, and form-factor, along with how to implement some of these new axes of responsive design.
Speaker: Una Kravets
Watch more:
Web at Google I/O 2021 Playlist →
All Google I/O 2021 Technical Sessions →
All Google I/O 2021 Sessions →
Subscribe to Google Chrome Developers →
#GoogleIO #Web #Design
product: Chrome – General; event: Google I/O 2021; fullname: Una Kravets; re_ty: Premiere; ;
For those of us doing client work, anything stuck in Chrome Canary is irrelevant. Container queries sound cool, but you could get some of that functionality using grid column min-max sizing.
Awesome video 😊
mind.blown.
Una great as always
wow! And here I was thinking which one to use, CSS-in-JS or CSS Modules !!! guess plain vanilla CSS is the way to go
전쳌ㆍ 악성코드
Una Kravets I always follow your stuff for anything about responsive, very insightful thanks a lot!
Really exciting! Where can we find the calendar demo?
cool indeed .. I thought it was going to go into how you must serve separate mobile/tablet/desktop pages.. just an upgrade to responsive yay lol 🙂
Looks like scrolling is slow on the demos
This is overwhelming! I loved container queries
fascinating. i'll have to revisit this video a number of times.
Thank you
css… cant live with it, cant live without it
well this is interesting
…coming in 2026 – continuous browser support in 2030 😂
Hey, google, stop over-engineering.
If some users don't like something, that's fine, they'll get used to it.
If they don't even know what they want, don't make more work over-posturing your app.
Come on.
Container queries are AMAZING!
Great video, thank you
When will you implement subgrid?
this is awesome
👍👍👍👍👍👍👍👍👍
Thank you 🙂
Thank you so much. I have no words to express my gratitude for the web.dev/learncss you have done.
Interested in seeing how this fleshes out across the new fangled foldable tech that is going to be introduced in the future.
Glad to see new features
all these new features are pretty exciting! Can't wait to see to see how they fit on a Design System.
my favorite component <3
this is blasphamy
Great features! But Tuesday should be 10th 😂
Thanks Una, … all the new toys😁
Nice
Container queries seem soooo game changing. Seriously this is basically all that was missing for developing truly independent components.
What about a @prefers-[language]???
When will you stop forcing android apps to be a certain language when I'm abroad or when, for example, an app has brazillian portuguese but I'm in Portugal? Brazillian Portuguese is different from Portuguese and it sucks not being able to at least use stuff in English
Combining the media queries with container queries is soooooooooo good
I've been waiting for this for YEARS!!!
1 day after leaving chrome to Firefox
YouTube recommendations :
Just with the preference color scheme I am sold
IE died just in time.
Container queries is the real beast here, the rest I would just call out as extras. Then scoped styles could become interesting if it's user friendly. But like all new features, this won't really be used until +7 years from now if I know the ecosystem and browser support, sigh…
In the current market trend – mobile-first, is hard to find some information about the CSS for BIG TV SCREEN. Maybe the future of CSS would be about mixing the mobile-first CSS approach with BIG TV. CSS. I mean users can search information on mobile and display the same data with BIG TV CCS? Is like switching between dark-light CSS, but I think switching small colors from the mobile display into a big screen would need some additional CSS library to install on both devices ( browsers ). When I wrote BIG TV SCREEN I do not mean the only TV at home but also in cars, trucks, trains, airplanes, and airports. The future of CSS is full of transferable data
Great video.
I think, that those 38 person with thumbs down is using IE 6 😉
Container queries will be great for saving time building out multiple components. But we're probably looking at another 3/5 years until it's widely adopted enough to justify using