> This layout creates uniformly-sized columns, without any rows I find it amusing that they've decided to refer to this as masonry layout. If you actually built a wall like this (as opposed to uniformly-sized rows , without any columns ) it would be a structural engineering disaster.
Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
41–50 of 359 posts
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#42If the designers of Unix had seen the light of CSS, they wouldn’t have bothered with shells and file descriptors and C and Awk and all that composable flotsam. They’d just created a single program, call it the “Central Software System”, and defined thousands of properties that let you control its state machine to produce the output you need. Presto! The perfect computer. If for some reason someone needs a new kind of…
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#43If the designers of Unix had seen the light of CSS, they wouldn’t have bothered with shells and file descriptors and C and Awk and all that composable flotsam. They’d just created a single program, call it the “Central Software System”, and defined thousands of properties that let you control its state machine to produce the output you need. Presto! The perfect computer. If for some reason someone needs a new kind of…
You can say that about almost any abstraction layer
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#44If the designers of Unix had seen the light of CSS, they wouldn’t have bothered with shells and file descriptors and C and Awk and all that composable flotsam. They’d just created a single program, call it the “Central Software System”, and defined thousands of properties that let you control its state machine to produce the output you need. Presto! The perfect computer. If for some reason someone needs a new kind of…
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#45> This layout creates uniformly-sized columns, without any rows I find it amusing that they've decided to refer to this as masonry layout. If you actually built a wall like this (as opposed to uniformly-sized rows , without any columns ) it would be a structural engineering disaster.
> amusing that they've decided to refer to this as masonry layout They haven't decided this. Keep reading! TL;DR: Perhaps the best syntax could be grid-template-rows: none; to convey “please do not give me any rows”. Sadly, it’s too late to use this name, because none is the default value for grid-template-* and means “please give me only implicit rows, no explicit ones”. Instead we could use the name off to convey “…
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#46Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#47I thought this kind of waterfall layout was cool and trendy a few years ago, but these days very few websites are doing it?
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#48Earlier quoted context omitted.
The whole point of this initiative is to stop using out of date float-hacks, or soon-to-be out of date hacks to CSS grid or flexbox. Firefox's masonry layout is in fact implemented in such a way that basically covers all layout cases by simply adding a new attribute that collapses grid rows.
>Firefox's masonry layout is in fact implemented in such a way that basically covers all layout cases That's good to know.
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#49I thought this kind of waterfall layout was cool and trendy a few years ago, but these days very few websites are doing it?
It has some use cases but for the most part it's literally a wall of unstructed information. Difficult to parse and build any mental hierarchy.
It's also ... incredibly easy to do with existing css.
Re: Help us invent CSS Grid Level 3, a.k.a. "Masonry" layout
#50I am wondering whether it makes sense to keep adding more "layout" options to CSS, given that we have the legacy floats and then the modern flexbox and grid layout. If there are still cases that are not covered, perhaps a better solution to to have one final constraints-based system that covers all layout cases, even if it comes at the cost of complexity. The CSS frameworks and utility libraries will then be built on…
The whole point of this initiative is to stop using out of date float-hacks, or soon-to-be out of date hacks to CSS grid or flexbox. Firefox's masonry layout is in fact implemented in such a way that basically covers all layout cases by simply adding a new attribute that collapses grid rows.
Not just Firefox, the proposal here is
grid-template-rows: off;