Once you have grasped the basics of CSS Grid, you quickly discover how it enables many existing design patterns in a streamlined, elegant way. However, we shouldn’t see Grid in isolation. Understanding how other parts of CSS work together with Grid is key, in order to get the most out of our new abilities.

Over the last few years, rapid browser implementation of advances in CSS have given us the ability to do many of these previously impossible things. We can use our new powers to build the same designs faster, or we can start to ask ourselves what we might do if we were solving these problems afresh.

Don’t let still being on a float based layout (like Bootstrap) stop you from using CSS Grid. Learn how the power of CSS combined with feature queries allow y...

Web layout has always been a hack — compounded by responsive design, web application needs, and the desire for consistency. Join the creator of Susy (a meta grid-system) for a review of layout and grid techniques — when to use them, what to consider, and how to roll your own layouts with minimum code. We'll look at everything from floats to CSS Grid, flexbox, and even custom properties — and how to start using the new toys right away, with only a few lines of code.

INTO THE WEEDS OF CSS LAYOUT There are lots of reasons to get excited about new layout methods in CSS, but what impact does moving to Flexbox and Grid have on performance? And once you have decided to adopt new layout methods, are some techniques more performant than others? In this talk we’ll take a serious look at the algorithms your browser is using in order to lay things out using Flexbox and Grid. By understanding how these algorithms work, you’ll be in a better position to make good decisions around layout, and fully take advantage of the possible performance gains of new CSS layout.