Issue 50
Containment, Grid Layout, Print Stylesheets, Carousels and accessible dialogs.
News
Issue 50
CSS Layout News has made it to Issue 50. That's a goodly amount of layout related links, thank you for subscribing!
Last week I spoke at a local event - the Bristech Meetup. I spoke about some of the interesting things that are happening in the world of CSS. You can find the slides and a link to the CodePen examples here.
Thanks to An Event Apart who are sponsoring the email this week. I'll be speaking at the events in Chicago, Orlando and San Francisco - bringing a brand new talk to the San Francisco show!
Rachel Andrew, CSS Layout News
Updates to the CSS Grid Layout Module Level 1 Draft
The introduction to the Grid Layout spec has been updated to more clearly outline the relationship and differences between Grid and Flexbox. For more on this take a look at my post Should I use Grid or Flexbox.
CSS Containment in Chrome 52 | Web Updates - Google Developers
"The good news is that modern browsers are getting really smart about limiting the scope of styles, layout, and paint work automatically, meaning that things are getting faster without you having to do anything.
But the even better news is that there’s a new CSS property that hands scope controls over to developers: Containment."
Learn
Ten Requirements For Making Home Page Carousels Work For End Users (If Needed) – Smashing Magazine
Carousels can be a contentious issue, however if you decide it is the best option for your site or the client has demanded one here are some tips and examples explaining how to make them work well.
CSS: The Perfect Print Stylesheet | NOUPE
We don't often see much about print stylesheets however if you've ever tried to print from a site that doesn't have one you'll know that the requirement hasn't gone away. Here is a good walkthrough of the things you can do to make your site nicely printable.
A11y Dialog
"No more excuse now. Make your dialog windows accessible."
Use this technique to ensure your dialog windows are accessible for screen readers users.
Interesting
Bootstrap 4: A Visual Guide to What’s New — WDstack — Medium
If you use Bootstrap here is a visual guide to what is new in Bootstrap 4.
Transforming the Shapes with Eva Ferreira | The Web Ahead
"Web pages are visually and technically a pile of boxes. By default, all those boxes are rectangles and squares. But they don't have to be any longer. With CSS we can now transform those rectangles into parallelograms, rhombuses, skewed boxes, circles, and elephants — or any shape we want. Eva Ferreira joins Jen Simmons to talk about what's possible and how to do it."
Our Sponsor
An Event Apart
We work hard to bring together the best minds in the field—people just like you—to dive deep into doing our jobs better and talk about what’s coming next. An Event Apart is three days of intense focus on digital design, UX, and more. If you care about creating the best possible experiences for the people who use your work, and crave concentrated time to level up your skills in the company of your peers, join us and save $100!
CSS Layout News Newsletter
Join the newsletter to receive the latest updates in your inbox.