Question

I would like to create a simple fluid layout whereby 4 columns of Equal width, drops to 3 columns of Equal width once the viewport is below a specific width, and then to 2 columns of Equal width at a further specified viewport width. When a column falls away, it should drop to the next line, thus display below the original columns.

Any pointers or a simple fiddle with colored divs on how to achieve this would be most helpful!

Thanks Devin

Answer 1

Thanks for all the useful pointers given. Here’s is an easy fiddle illustrating how it can be acheived: jsfiddle.net/Paulie_D/QFhh9