Skip to content

Issue 68

CSS Grid Intent to Ship for Chrome posted, lots of flexbox and more.

Rachel Andrew
2 min read


Issue 68

Conference season rumbles on. I'm in Berlin today where yesterday I spoke on interesting new CSS at GOTO Berlin. At the end of last week I was speaking on the same subject at ffconf in Brighton. There are some code examples for these talks here, and I believe both events were filmed so I'll share a video when I see one.

After a brief stop at home (to do the laundry and see my cat) I'm off to in Singapore. I can't wait to meet people from the CSS and tech community there. I'm in Singapore for a week, let me know if you are based there or around for one of the DevFest events and want to meet up.

Rachel Andrew, CSS Layout News

Intent to Ship: CSS Grid Layout - Google Groups

Here is the Intent to Ship for CSS Grid Layout which also details interoperability and implementation status.

It has been five years since work on Grid started in WebKit - this was before Blink forked from WebKit. Here's the initial email to the webkit-dev list. I'm so excited about having Grid Layout out from behind browser flags!


Grid by Example: Aligning and Justifying Grid Items

In this video we look at using the align-items, justify-items, align-self and justify-self properties. These are defined in the Box Alignment Level 3 specification and apply to grid layout.

Grid by Example: Aligning and Justifying the grid

In this video I demonstrate the align-contents and justify-contents properties. These are defined in the Box Alignment Level 3 specification and apply to grid layout.

AtoZ CSS: The z-index CSS Property - SitePoint

An explanation of z-index with this video from SitePoint.

Make Forms Fun with Flexbox

A tutorial covering using Flexbox to layout forms.


Rethinking Responsive Design – Medium

"We need to recognize that screens are ephemeral, and that making something responsive will no longer be about screens. It’ll be about experiences."

Responsive "background-size: contain" Video

A pen demonstrating how to do a full size background video.

Responsive pure CSS tabs & accordion

Another CodePen example, this time demonstrating a flexbox method for creating CSS tabs.

Fibonacci – Flexbox Composer

This is interesting, although you would need to be careful with the output it may well be a nice way to learn how the various flex properties work.

Our Sponsor

Friendly UK Cloud Hosting by Bytemark

Friendly UK Cloud Hosting by Bytemark

Your beautiful web apps need a simple, reliable back-end. Join the smart accessible company of sites like, and, all of whom use our UK-owned data centres and cloud servers. We built our whole stack ourselves down to the data centre, and offer phone support - so there's no hosting problems we can't solve. Our cloud servers start at £10/month so call today, or sign up online to get a one month free trial.