How to lay-out list items like a grid with CSS and HTML?

Question

I have a div block which does not have a fixed width.

Inside, I have an

• ..
block with 11 items. I would like these

Answer 1

The "Inline Blocks" link that Jordan posted is a great resource, particularly when it comes to older browser support. For quick reference for others landing on this page off of google, the basic css for creating a centered, inline-block grid is:

ul {
    margin: 0 auto;
    text-align: center;
}

li {
    display: inline-block;
    vertical-align: top;
}