Side-by-side list items as icons within a div (css)

Question

I am looking for a way to create a

of items that I can put within a
and have them show up side-by-side and wrap to the next

Answer 1

I used a combination of the above to achieve a working result; Change float to Left and display Block the li itself HTML:

    
bar1
    
bar2

CSS:

.foo li {
    display: block;
    float: left;
    width: 100px;
    height: 100px;
    border: 1px solid black;
    margin: 2px;
}