Tiling divs inside a wrapping div rather than have them appear outside

[KyleTroy]

I'm trying to have a series of tiles inside a wrapping div element. At the moment, they appear inside the wrapping div and then overflow outside the div instead of wrapping horizontally and appearing as tiles. Here's a JSFiddle example:\[code\]http://jsfiddle.net/cgMGM/\[/code\]To give an example of how they should look, take a look at the Windows Metro interface where the tiles wrap around to a new column:\[code\]http://i.imgur.com/VlxIK.jpg\[/code\]Apparently I can't submit a post without a code block if I have a jsfiddle link, so here's the CSS:\[code\]body { margin-top: 50px; background: #238d9a;}#metro { width: 960px; height: 340px; background: #004050; margin: 0 auto; padding: 10px;}.tile { width: 100px; height: 100px; background: white; margin: 0px 10px 10px 0px;}?\[/code\]