2 Col Grid
A 2 col grid is 2 blocks of text displayed in 2 columns, repeated in rows.
It is designed to encourage readers to keep scrolling and to break up, or highlight, sections of text.
When to use this component
Use this component to:
- short, bitesize content in a more interesting way than paragraphs of straight text.
- A group of short paragraphs with headings.
Note: The text does not flow between the two columns
When not to use this component
If an image is required, then the ‘Image + text’ component can be used
Decide between using 2 Col Grid and 2 Col list
Use the 2 Col Grid to:
- Display short bodies of text (a paragraph) that can be grouped
- For example; to summarise points / key facts / list of steps
Use the 2 Col List to:
- Display medium sized bodies of text (a couple of paragraphs) that can be grouped
- To enable users to skim read short sections of content.
- For example; ordered lists & steps / timeline of events
