You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: css-grid-2/Overview.bs
+39Lines changed: 39 additions & 0 deletions
Original file line number
Diff line number
Diff line change
@@ -189,3 +189,42 @@ Subgrids</h2>
189
189
Since <a>subgrids</a> can be placed before their contents are placed,
190
190
their lines automatically receive the line names specified on the parent <a>grid</a>.
191
191
</ul>
192
+
193
+
<!-- Big Text: masonry -->
194
+
195
+
<h2 id=masonry>
196
+
Masonry Layout</h2>
197
+
198
+
<div class=issue>
199
+
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,
200
+
and it doesn't seem to have slowed,
201
+
so it's probably not just a layout fad.
202
+
Would probably be worthwhile to address officially.
203
+
204
+
As far as I can tell,
205
+
this is best done as a Grid feature;
206
+
some of the features I've seen in masonry libraries
207
+
(like large items spanning multiple masonry tracks)
208
+
make Flexbox inappropriate.
209
+
This also would reuse *so many* Grid features
210
+
that it would be a shame to put together a brand new layout spec for it.
211
+
212
+
No clue what it would look like yet, tho.
213
+
In handwavey terms, it's a grid that's only gridded
214
+
"in one dimension",
215
+
and free-flows in the other,
216
+
with auto-flow.
217
+
218
+
Note that this is actually 100% possibly with Grid today,
219
+
if your items are of known height,
220
+
by making thousands of 1px tall rows,
221
+
and setting the items' row-span to be equal to their height in px.
222
+
(Or some lower-res multiple, like 10px rows.)
223
+
Dense row auto-flow then magically makes Masonry happen.
224
+
This is just a terrible hack that runs into memory/CPU issues
0 commit comments