Question

I ran into a problem where I am only give a container div with around 10 divs inside. I would like to find a way to turn this 1 column of divs into 2 columns without adding additional divs (ie. not adding divs for left column or right columns). I can and most preferably would like to find a CSS solution.

<div class="container">
    <div>1</div>
    <div>2</div>
    <div>3</div>
    <div>4</div>
    <div>5</div>
    <div>6</div>
</div>

Ideal output:

1      2
3      4
5      6

I tried fooling around with floating but it didn’t work out too well. Please let me know. Thanks!

Answer 1

Like that: http://jsfiddle.net/Qzj2d/ ? That is the simplest solution (not necessary the prettiest one).