display columns

by Kheema Pandey

HTML

<div class="content">
    <div class="item">1</div>
    <div class="item">2</div>
    <div class="item">3</div>
    <div class="item">4</div>
    <div class="item">5</div>
    <div class="item">6</div>
    <div class="item">7</div>
    <div class="item">8</div>
    <div class="item">9</div>
    <div class="item">10</div>
    <div class="item">11</div>  
    <div class="item">12</div>  
</div>

CSS

.content{
    padding:10px;     
    width:282px;
    height:105px; /*Height need to change*/
    border:solid 1px #444;
    display: flex;
    display: -ms-flexbox; 
    display: -webkit-flex;
    flex-flow: column wrap;
    -webkit-flex-flow: column wrap;
}
.item{
    padding:5px;
    margin-right:5px;
    width:50px;
    border:solid 1px #999;
}