Skip to content

Commit 5b00b7c

Browse files
committed
[css-grid-2] Remove issue about masonry layout; discussion is happening in #945 and it's not entirely clear it's a Grid issue.
1 parent ef68539 commit 5b00b7c

File tree

1 file changed

+0
-47
lines changed

1 file changed

+0
-47
lines changed

css-grid-2/Overview.bs

Lines changed: 0 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -362,50 +362,3 @@ Aspect-ratio&ndash;controlled Gutters</h2>
362362
}
363363
</pre>
364364
</div>
365-
366-
<!--
367-
██ ██ ███ ██████ ███████ ██ ██ ████████ ██ ██
368-
███ ███ ██ ██ ██ ██ ██ ██ ███ ██ ██ ██ ██ ██
369-
████ ████ ██ ██ ██ ██ ██ ████ ██ ██ ██ ████
370-
██ ███ ██ ██ ██ ██████ ██ ██ ██ ██ ██ ████████ ██
371-
██ ██ █████████ ██ ██ ██ ██ ████ ██ ██ ██
372-
██ ██ ██ ██ ██ ██ ██ ██ ██ ███ ██ ██ ██
373-
██ ██ ██ ██ ██████ ███████ ██ ██ ██ ██ ██
374-
-->
375-
376-
<h2 id=masonry>
377-
Masonry Layout</h2>
378-
379-
<div class=issue>
380-
People have been trying to use CSS for <a href="https://github.com/w3c/csswg-drafts/issues/1009#issuecomment-278095001">masonry layouts</a> for over a decade,
381-
and it doesn't seem to have slowed,
382-
so it's probably not just a layout fad.
383-
Would probably be worthwhile to address officially.
384-
385-
As far as I can tell,
386-
this is best done as a Grid feature;
387-
some of the features I've seen in masonry libraries
388-
(like large items spanning multiple masonry tracks)
389-
make Flexbox inappropriate.
390-
This also would reuse *so many* Grid features
391-
that it would be a shame to put together a brand new layout spec for it.
392-
393-
No clue what it would look like yet, tho.
394-
In handwavey terms, it's a grid that's only gridded
395-
"in one dimension",
396-
and free-flows in the other,
397-
with auto-flow.
398-
399-
Note that this is actually 100% possibly with Grid today,
400-
if your items are of known height,
401-
by making thousands of 1px tall rows,
402-
and setting the items' row-span to be equal to their height in px.
403-
(Or some lower-res multiple, like 10px rows.)
404-
Dense row auto-flow then magically makes Masonry happen.
405-
This is just a terrible hack that runs into memory/CPU issues
406-
due to the large number of rows.
407-
It suggests, tho,
408-
that making it work properly
409-
is mostly a matter of relaxing some constraints,
410-
rather than adding entirely new behavior.
411-
</div>

0 commit comments

Comments
 (0)