Hello World. This is Foldr.

Since I first began seeing grid systems on the web, I knew that it was the future of where the web would go.

Layout would never be the same. Then came mobile devices. Then came the responsive web on A List Apart [Cite]. And the Golden Grid system.

None of these systems quite covered what I wanted. I wanted a responsive grid that didn't snap, that didn't rely on javascript for layout, and that was flexible and easy to use. Foldr was born.

Demo:

Fold and Go Seek:

.split

x2 column .hide-folded
x2 column
x2 column .hide-folded
x2 column .show-folded
x2 column
x2 x2 column .hide-folded
x2 x2 column
x2 column
x3 column
x3 column
x3 x2 column .hide-folded
x3 x2 column
x2 column
x2 x3 column .hide-folded
x2 x3 column
x2 x3 column

Fold:

.split

x2 column
x2 column
x2 x2 column
x2 x2 column
x2 x3 column
x2 x3 column
x2 x3 column
x2 x2 x2 column
x2 x2 x2 column
x2 x2 column
x2 x4 column
x2 x4 column
x2 x4 column
x2 x4 column

.split3

x3 column
x3 column
x3 column
x3 x3 column
x3 x3 column
x3 x3 column
x3 x4 column
x3 x4 column
x3 x4 column
x3 x4 column
x3 x2 column
x3 x2 column

.split4

x4 column
x4 column
x4 column
x4 column
x4 x2 column
x4 x2 column
x4 x2 x2 column
x4 x2 x2 column
x4 x2 column
x4 x3 column
x4 x3 column
x4 x3 column
x4 x4 column
x4 x4 column
x4 x4 column
x4 x4 column

.split-wrap

wrap column
wrap column
wrap column
wrap column
wrap column
wrap column
wrap column
wrap column
wrap column
wrap column