Stackoverflow - CSS: Ignoring divs height when floating

http://stackoverflow.com/q/8843465/918414

by secretgspot

HTML

<div id="container">
    <img class="image" src="http://farm1.staticflickr.com/205/494701000_744cc3a83a_z.jpg" />
    <img class="image" src="http://farm5.staticflickr.com/4028/4287569889_f6a4fca31b_z.jpg" />
    <img class="image" src="http://farm3.staticflickr.com/2340/2421926504_d8509d0a98_z.jpg" />
    <img class="image" src="http://farm1.staticflickr.com/197/503792921_fedf8ba47e_z.jpg" />
    <img class="image" src="http://farm2.staticflickr.com/1153/741035029_f394e11a1f_z.jpg" />
    <img class="image" src="http://farm7.staticflickr.com/6213/6243090894_8b8dd862cd_z.jpg" />
    <img class="image" src="http://farm2.staticflickr.com/1339/1157653249_dbcc93c158_z.jpg?zz=1" />
    <img class="image" src="http://farm3.staticflickr.com/2570/4220856234_029e5b8348_z.jpg?zz=1" />
    </div>

    

            
            
                        
            
            
            
            
            
            
            
            
            
            




    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
   ...

CSS

#container {
    column-count:             3;
        -moz-column-count:    3;
        -ms-column-count:     3;
        -o-column-count:      3;
        -webkit-column-count: 3;
    column-fill:              balance;
        -moz-column-fill:     balance;
        -ms-column-fill:      balance;
        -o-column-fill:       balance;
        -webkit-column-fill:  balance;
    column-gap:               10px;
        -moz-column-gap:      10px;
        -ms-column-gap:       10px;
        -o-column-gap:        10px;
        -webkit-column-gap:   10px;
    width: 660px;
}

.image { 
    display: block;
    margin-bottom: 10px;
    width: 100%;
}