Overview
We spent years trying to get floats to give us a 12-column grid. Then flexbox came along, and it was better at making a 12-column grid. Then grid layout landed, and we celebrated by making a 12-column grid in two lines of code. However, if we stop there, we miss out on much that these new layout methods have to offer.
In this talk, discover how CSS is evolving to allow components to react to their content and immediate location in a document. We’ll look at tools you can use right now and take a compelling look at what is just around the corner with container queries.
Objective
To understand how to create layouts and components that can react to different types of content.
Five Things Audience Members Will Learn
- How to use grid and flexbox to size things according to their content
- How to create reusable components using CSS
- What new sizing methods and functions are available
- How to use the new aspect-ratio property to create containers for components and prevent cumulative layout shift
- The upcoming container queries spec, which will allow components to respond to the available size of their container rather than the viewport
Audience
Web developers who understand some CSS.
