71–80 of 359 posts
> 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.
If 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…
If 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…
I thought this kind of waterfall layout was cool and trendy a few years ago, but these days very few websites are doing it?
For awhile it was just described as "Pinterest style." 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.
care to demonstrate? given a dynamic collection of images where you don't know the aspect ratios beforehand
Oh yes please. Masonry is definitely the missing piece right now. And I run into cases where designers give it to me pretty regularly-- I don't want to crush their dreams but without a JS-free masonry solution, the dreams are getting crushed. OK, having read a lot more, here's my thoughts. I love the possibilities that can be raised here when masonry is built into grid, but you can target specific rows and columns fo…
I built a masonry layout with only CSS and HTML 10 years ago. The site is actually still live. A scripting language is used to generate the HTML and CSS based on the dimensions of the images. But the masonry runs left to right not top to bottom.
How does that differ from just setting the images to be inline-blocks? Was it justified?
I strongly dislike the megamenu demo https://webkit.org/demos/grid3/megamenu/ >, and feel masonry is completely inappropriate there. It makes a complete mess of flow direction, badly breaking expectations. The reading order you’d expect : https://temp.chrismorgan.info/2024-04-23-masonry-megamenu-2.... . What the demo actually gives you: https://temp.chrismorgan.info/2024-04-23-masonry-megamenu-1.... . This affects co…
So you're saying the a11y tree and tab ordering is bypassing the actual ordering of content and instead traversing the columns one by one? I'd call that a bug. In a masonry layout the expectation of a sighted user is that there is no continuity from column to column, but instead through the visual line. And the "unexpected" (disagree) ordering you show does that. I think the issue would be that tab ordering is ignori…
I’m saying that masonry is risky if you’re using it purely visually, specifically because it’s purely visual. It’s the same deal with the CSS `order` property: it can be useful, but you have to be careful not to break expectations.
CSS is almost purely visual. There are a few cases where it influences the accessibility tree (e.g. `display: none`, `speak-as`, `appearance` in some user agents), but never in anything like order.
Oh yes please. Masonry is definitely the missing piece right now. And I run into cases where designers give it to me pretty regularly-- I don't want to crush their dreams but without a JS-free masonry solution, the dreams are getting crushed. OK, having read a lot more, here's my thoughts. I love the possibilities that can be raised here when masonry is built into grid, but you can target specific rows and columns fo…
100% for masonry as well, couldn't care less about the approach as long as the selected one doesn't see the same fate as websql and it becomes a viable solution in a reasonable amount of time.
But grid is already extremely complicated, and so easy to get wrong it's a meme at this point. Creating even more confusion about how it's fundamentals work feels like the wrong path :-/
Earlier quoted context omitted.
JavaScript is the final layout system. No declarative language can ever handle every use case. Fortunately I rarely need to resort to JS since grid came out. I’m not sure a constraint based system would do much good as it would sit awkwardly in the middle of grid and JS.
> No declarative language can ever handle every use case. Prolog would beg to differ.
If 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…