Layout
Column Span
Style syntax for setting how elements span across multiple columns.
🚧This page is still under construction and some content may not be complete.
Overview [sr-only]
1
2
3
4
5
6
7
<div class="cols:3"> <div>1</div> <div>2</div> <div>3</div> <div class="col-span:all">4</div> <div>5</div> <div>6</div> <div>7</div></div>Basic usage
Span across all columns
Use col-span:value to make elements span across all columns.
Introduction to animals
There are many different types of animals in the world, and each has its own unique set of characteristics. No matter what type of animal you're interested in, you're sure to find something interesting and informative here. From spiders to whales, take a look at some of the most amazing creatures on earth!
<div class="cols:3"> ### Introduction to animals <p>There are many different types of animals in the world …</p> </div>Conditionally apply
Apply styles in different states using selectors, media queries, etc.
<div class="column-span:all:hover column-span:all@sm column-span:all@dark column-span:all@print">…</div>