next
This commit is contained in:
1 parent
b244287f6a
commit
5a2d49c17f
77 files changed
+2289
-31
No files matched your search
@@ -0,0 +1,23 @@
|
||||
---
|
||||
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.
|
||||
Reference in new issue
Block a user