container

The basic .grid.-container blah blah.
.-span-6
.-center-6
.-last-6

directionalKeys

grid

.grid defaults to one column.
You can change this by adding a modifier: .-columns-N.
You can use .cell.-span-N as a utility to span columns.
You can use .cell.-right to right align an element.
4 middle cells
You can use .cell.-center-N to center an element, as best as it can.
Examples

This section is grid -columns-2.

Al of the layout for these sections are being done using .grid and .cell.

This shows how to do two-thirds content.

Mauris euismod sit amet dolor vel vehicula. Nulla lacinia augue sem, accumsan luctus nunc facilisis Duis ex libero, auctor a semper in, condimentum sit amet enim. Vestibulum et consectetur arcu. Nam nunc justo, varius id metus eu praesent dictum sit amet quam efficitur placerat.

And here's an example centering the content.

Mauris euismod sit amet dolor vel vehicula. Nulla lacinia augue sem, accumsan luctus nunc facilisis Duis ex libero, auctor a semper in, condimentum sit amet enim. Vestibulum et consectetur arcu. Nam nunc justo, varius id metus eu praesent dictum sit amet quam efficitur placerat.

Learn More Buy Now

srOnly

There is a hidden sentence after this one that is only visible to screen readers. This is done by using the srOnly class.