Edit in JSFiddle


              
<div class="masonry">
   <div class="item">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</div>
   <div class="item">Neque, vitae, fugiat, libero corrupti officiis sint facilis tempora quidem repudiandae praesentium odit similique adipisci aut.</div>
   <div class="item">Incidunt sit unde minima in nostrum?</div>
   <div class="item">Ducimus, voluptates, modi, delectus animi maiores consequuntur repellat quisquam fugiat eum possimus enim culpa totam praesentium magni quae!</div>
   <div class="item">Lorem ipsum dolor sit amet, dicta dolore adipisci hic ipsam velit deleniti possimus cumque accusantium rerum quibusdam.</div>
   <div class="item">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quae, praesentium consequatur ducimus commodi quam ex illo omnis dicta reiciendis vel nesciunt deserunt aut sequi nam mollitia perferendis ipsam possimus temporibus!</div>
   <div class="item">Ab, adipisci, temporibus eaque quis harum perferendis incidunt cupiditate doloribus dolor numquam voluptates ipsum dolore aspernatur et voluptate ipsam beatae animi culpa.</div>
</div>
.masonry { /* Masonry container */
    -moz-column-count: 4;
    -webkit-column-count: 4;
    column-count: 4;
    -moz-column-gap: 1em;
    -webkit-column-gap: 1em;
    column-gap: 1em;
}

.item { /* Masonry bricks or child elements */
    background-color: #eee;
    display: inline-block;
    margin: 0 0 1em;
    width: 100%;
}