Stackoverflow - Display list item elements in different columns

Display list item elements in different columns http://stackoverflow.com/questions/21409424/display-ul-li-in-diferent-collums/21409646#21409646

by Hashem Qolami

HTML

<ul>
    
    <li>A</li>
    
    <li>B <br />
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem et ipsa dolores ab recusandae non molestiae tenetur aliquam natus molestias alias asperiores officia perspiciatis aut magni deserunt ullam eaque omnis.
    </li>
    
    <li>C</li>
    
    <li>D</li>
    
    <li>E</li>
    
    <li>F</li>
    
    <li>G</li>
    
    <li>H</li>
    
</ul>

CSS

* {
    padding: 0;
    margin: 0;
}

ul {
    list-style: none;
    padding: 0;
    font: 0/0 a;  /* Remove space characters between inline-block elements */
}

ul li {
    font: 16px/1 Arial, sans-erif;
    display: inline-block;
    vertical-align: top;
    background-color: #DDD;
    margin: 5px;
    width: 200px; /* For demo */
}