Re: Jonathan Snook’s Container Grids

First of all, huh! I guess Grid tracks do act sorta like pseudo contain: size layout style; (but not paint) elements.

You’d probably have to outlaw min-content and max-content grid track sizes, when using grid/container queries. minmax() too? Sometimes? That’d be a big loss.

What are the pros of tying container queries to a layout system that contains by default, rather than allowing arbitrary opt-in containment? I can think of a few:


Lastly, a criticism of the syntax:

I’m imagining a syntax similar to responsive images that allows you to specify the minimum width for which the grid would apply.

.grid {
	display: grid;
	200px 300px 600w, 
	200px 200px 1fr 900w;

w descriptors in srcset describe the intrinsic width of the external image resource, but do not instruct the browser to do anything. The ones above are lil’ media queries – micro-if/then statements about exactly what to do under what circumstances. This proposal would be better if it just used media-query-like syntax (that queries the grid container, not the whole viewport):

.grid {
	display: grid;
		(min-width: 600px) 200px 300px, 
		(min-width: 900px) 200px 200px 1fr;

Fiddling with this.

For oft, when on my couch I lie
In vacant or in pensive mood,
They flash upon that inward eye
Which is the bliss of solitude

“…floats on high o’er vales and hills…”

Mom Smelling Aunt, 2012

An ice rainbow in the clouds at dusk

— Older →