Welcome to CSS Grid.
A simple, minimal and lightweight responsive css grid.
Designed for web developers looking for a simple grid to build websites.

- Use percentage or fixed width columns from 1 to 8 with variations.
- Add margins to columns.
- Stack columns for responsive using media queries.
- 4 header options, static, fixed, sticky, reveal.
- 3 navigation options, right, left, center.

Code example, percentage 2 columns:


	<div class="p2">
		<div class="one">
			1
		</div>
		<div class="two">
			2
		</div>
	</div>

1 Column

1

2 Columns

1
2

3 Columns

1
2
3
1
2 - 3
1 - 2
3

4 Columns

1
2
3
4
1
2 - 4
1 - 2
3 - 4
1 - 3
4
1
2 - 3
4
1
2
3 - 4
1 - 2
3
4

5 Columns

1
2
3
4
5
1
2 - 5
1 - 2
3 - 5
1 - 2
3 - 4
5
1 - 3
4 - 5
1 - 4
5
1
2 - 4
5
1
2 - 3
4 - 5

6 Columns

1
2
3
4
5
6
1
2 - 6
1 - 2
3 - 6
1 - 3
4 - 6
1 - 4
5 - 6
1 - 5
6
1
2 - 5
6
1
2 - 4
5 - 6
1
2 - 3
4 - 6
1 - 2
3 - 4
5 - 6
1 - 2
3 - 5
6
1 - 3
4 - 5
6

7 Columns

1
2
3
4
5
6
7
1
2 - 7
1 - 2
3 - 7
1 - 3
4 - 7
1 - 4
5 - 7
1 - 5
6 - 7
1 - 6
7
1
2 - 6
7
1
2 - 5
6 - 7
1
2 - 4
5 - 7
1
2 - 3
4 - 7
1 - 2
3 - 6
7
1 - 2
3 - 5
6 - 7
1 - 2
3 - 4
5 - 7
1 - 3
4 - 5
6 - 7

8 Columns

1
2
3
4
5
6
7
8
1
2 - 8
1 - 2
3 - 8
1 - 3
4 - 8
1 - 4
5 - 8
1 - 5
6 - 8
1 - 6
7 - 8
1 - 7
8
1
2 - 7
8
1
2 - 6
7 - 8
1
2 - 5
6 - 8
1
2 - 4
5 - 8
1 - 2
3 - 7
8
1 - 2
3 - 6
7 - 8
1 - 2
3 - 5
6 - 8
1 - 2
3 - 4
5 - 8
1 - 3
4 - 5
6 - 8
1 - 3
4 - 6
7 - 8
1 - 3
4 - 7
8
1 - 4
5 - 6
7 - 8
1 - 4
5 - 7
8
1
2 - 3
4 - 5
6 - 7
8