Grid Test

Auto Columns

Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.

Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.

Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.

Vertical Centering

column is-half is-centered

Named Columns

is-three-quarters

Auto

Auto

is-two-thirds

Auto

Auto

Auto

is-half

Auto

is-one-third

Auto

Auto

is-one-quarter

Auto

Numbered Columns

.column .is-3

.column .is-6

.column .is-3

.is-2
.is-3
.is-6
.is-1

Nested Grid

First column
First nested column
Second nested column
Second column
50%
Auto
Auto

Gapless

First column

Second column

Third column

Fourth column

Narrow

Narrow column

This column is only 100px wide.

Flexible column

This column will take up the remaining space available.

Offset Columns

column is-half is-offset-one-quarter

column is-4 is-offset-8

Multiline

is-one-quarter

is-one-quarter

is-one-quarter

is-one-quarter

is-half

is-one-quarter

is-one-quarter

is-one-quarter

Auto

Vertical Alignment

Line 1
Line 2
Line 3
Line 4
Line 5

align-top

align-middle

align-bottom