Web Unleashed 2021

2021-10-20 00:00:00 2021-10-22 00:00:00 America/Toronto Web Unleashed 2021 Drive your career to the forefront by learning the latest tools, techniques and technologies in front-end web development. Online FITC EDT Online

Presentation


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

  1. How to use grid and flexbox to size things according to their content
  2. How to create reusable components using CSS
  3. What new sizing methods and functions are available
  4. How to use the new aspect-ratio property to create containers for components and prevent cumulative layout shift
  5. 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.