Search

What is safe alignment in CSS?

By Chris Coyier on

Stefan Judis covered this recently, and like Stefan, I first heard of the safe keyword in CSS from Rachel Andrews at an AEA conference years ago. It’s used in addition to other alignment keywords in layout like this for example: The extra value safe here is essentially saying “don’t let the alignment force a situation […]

The Fifty-Fifty Split and Overflow

By Chris Coyier on

A left-and-right layout is blissfully easy with CSS grid. Something like grid-auto-rows: 1fr; will do it — just put two elements as the children. This is how I like to roll though, making two equal columns that can shrink properly: But Ryan Mulligan found a very interesting way to make it complicated in The Fifty-Fifty […]

Vertical Centering in a Block-Level Element

By Chris Coyier on

Rachel Andrew, blowing my mind a bit: The align-content property from the Box Alignment spec does the job, however browsers require that you make the parent element either a flex or a grid layout. While the property was specified to work in block layout, no browser had implemented it, until now. align-content in block layout So now […]