Grid Intent Overview
Grid intent contains grid layout related utilities.
Utilities available in @grid intent are listed below.
| Utility | Description | Documentation |
|---|---|---|
col-* | Set grid item's size and location on columns. | col |
cols-* | Define number of grid columns. | cols |
content-* | Control grid content alignment along block-axis. | content |
flow-* | Define grid layout flow direction using auto-placement algorithm. | flow |
items-* | Align grid items within container along block-axis. | items |
justify-* | Align grid items along inline-axis. | justify |
order-* | Set grid item's order or position. | order |
place-* | Set grid items alignment along block-axis and inline-axis combined. | place |
preset-* | Use preset, grid layout combinations. | preset |
row-* | Set grid item's size and location on rows. | row |
rows-* | Define number of grid rows. | rows |
self-* | Align individual grid item along block-axis. | self |