Six Equal Columns

Six Equal Column Responsive Pattern starting as a single column mobile first layout.

The columns start mobile first with 100% and work up in a two column, then a three column grid before finishing with the six even columns. When using multiple columns you need to ensure that the line length is suitable for easy reading, somewhere between 50-75 characters.

Six Equal Columns

See the Pen 6 Equal-Width Columns by Justin Avery (@justincavery) on CodePen.

View Codepen for Six Equal Columns

Subscribe to our Newsletter

Add your email address and receive an email every Friday covering off everything worth knowing about building your websites responsively.