Files
homepage_relaunch/.design-sync/ds-src/Col.md
T
2026-09-20 12:45:33 +02:00

24 lines
712 B
Markdown

---
category: Layout
---
# Col
One block on the grid. `span` is how many of the twelve columns it occupies; `start` is the
column it begins at, counting from 1.
Use `start` to leave a gap. An offset block is the house style: content that begins at
column 7 or 9 rather than immediately after its neighbour reads as deliberate, and the empty
columns are doing work.
A full-width block is `span={12}`, which is also the default.
```jsx
<Col span={5} start={8}>
<Text measure>Every interface between components is an attack surface.</Text>
</Col>
```
Astro equivalent: `<div style="grid-column: 8 / span 5;">`. Grid positions are the one place
a raw number is allowed; every other value comes from a token.