Web Grids - Columnar Layout in Web Grids

1 Column Grid

1 Column Layout

J Kyrnin

The 1 column grid has been around as long as there has been a World Wide Web. In fact, in the first iterations of Web pages, 1 column was all you had. When you use a grid with one column you have a simple design, but there are some good uses for it - and as you can see in this image, a 1-column grid does not prevent you from having as many rows of elements as you need.

• 1 Column Grid
• 2 Column Grid: Even Columns
• 2 Column Grid: Odd Columns
• 3 Column Grid: Even Columns
• 3 Column Grid: Even Columns With Overlap
• 3 Column Grid: Even Columns With Overlap in the Middle
• 3 Column Grid: Odd Columns
• 3 Column Grid: Odd Columns with Overlap
• 3 Column Grid: Odd Columns with Overlap
• 4 Column Grid and Grids with as Many Columns as You Need