22 lines
591 B
Markdown
22 lines
591 B
Markdown
---
|
|
category: Layout
|
|
---
|
|
|
|
# Grid
|
|
|
|
The twelve-column grid. It is the tool for asymmetry, which is how this site composes a
|
|
band: a headline across 7 or 8 columns, its supporting copy across 4 or 5, offset against
|
|
each other rather than centred or evenly split.
|
|
|
|
Place children with Col. Do not nest a Grid inside a Col unless the inner block genuinely
|
|
has its own twelve-column structure.
|
|
|
|
```jsx
|
|
<Grid>
|
|
<Col span={7}><Heading>Security is built in, not bolted on.</Heading></Col>
|
|
<Col span={4} start={9}><Text measure>…</Text></Col>
|
|
</Grid>
|
|
```
|
|
|
|
Astro equivalent: `<div class="grid">`.
|