CSS / PHP：如何使下一个div出现在侧面

Question

I'm stuck on the project that I am doing right now. I made a php that outputs a single div, this div will output multiple times depending on the number of items that I have in my database, my problem is that, I want the next div to be outputted on the left side of the previous div, just like this:

 -----   -----   -----
|div 1| |div 2| |div 3|
 -----   -----   -----
 -----   -----   -----
|div 4| |div 5| |div 6|
 -----   -----   -----

But I can't think of any ways to do it, it's outputting as it should be like this:

 -----
|div 1|
 -----
 -----
|div 2|
 -----
 -----
|div 3|
 -----
and so on...

Hope you guys can help me, thanks.

PHP:

$results = $mysqli->query("SELECT * FROM content");
    if ($results) { 

    //fetch results set as object and output HTML
    while($obj = $results->fetch_object())
        {
        echo '<div class="content">'; 
        echo '</div>';
        }
    }

CSS:

.content{
    margin-bottom: 10px;
    height: 300px;
    background: #F0F0F0;
    padding: 10px;
    border: 1px solid #DDD;
    border-radius: 5px;
    box-shadow: 2px 2px 2px #F8F8F8;

}

Answer 1

need a wrap div for class="content"

$results = $mysqli->query("SELECT * FROM content");
    if ($results) { 

    //fetch results set as object and output HTML
    while($obj = $results->fetch_object())
        {
        echo '<div class="box"><div class="content">'; 
        echo '</div></div>';
        }
    }

and the css

.box{
     width: 33.333333333%;
     box-sizing: border-box;
     float: left;
     }

here is demo http://jsfiddle.net/taunj8m0/2/