top | item 40137556

(no title)

bfgeek | 1 year ago

The requires it for sizing the columns (the step before placing the items into the columns).

discuss

order

JoshTriplett|1 year ago

The examples in the article seem to have CSS that directly sizes the columns, albeit with some flexibility such as being able to change the number of columns to better fit the width. It seems like the item widths depend on the column widths, rather than the other way around (which seems like it'd be circular). What's an example where the column widths depend on the items?

bfgeek|1 year ago

If you have something like:

  columns: 1fr auto max-content

  <!-- items -->
  <div>1</div>
  <div>somethingsuperlong</div>
  <div style="span: 2;">something else</div>
You first need to decide how big each of the three columns are going to be, then you want to place the items in each of the columns.

Depending on the non-fixed column type (there are different rules for each type) you want to ensure their constraints are satified (typeically they are big enough to encompass the items).