带有CSS的方形瓷砖

Question

http://i.stack.imgur.com/OY7Bp.png

我想用我的方块填充整个DIV。我将实施更多，但我不知道如何弥补差距。我想添加更多，只是为了让它看起来很酷。我认为它解释了一切......

HTML

    <div id="play">

<div id="quest" class="small"></div>
<div id="quest" class="tall"></div>
<div id="quest" class="vsmall"></div>
<div id="quest" class="vsmall"></div>
<div id="quest" class="medium"></div>
<div id="quest" class="vsmall"></div>
<div id="quest" class="vsmall"></div>
<div id="quest" class="vsmall"></div>
<div id="quest" class="medium"></div>
<div id="quest" class="small"></div>
<div id="quest" class="small"></div>
<div id="quest" class="vsmall"></div>
<div id="quest" class="vsmall"></div>
<div id="quest" class="small"></div>
<div id="quest" class="small"></div>

</div>

CSS

#play {width: 820px; height: 500px; background-color: #262626; margin-left: auto; margin-right: auto;}
#quest {float: left; background-color: #C2D6FF; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;border: 1px solid black;}
.vsmall {width: 40px; height: 40px;}
.small {width: 80px; height: 80px;}
.tall {width: 60px; height: 120px;}
.medium {width: 120px; height: 120px;}

知道如何将所有内容合并在一起，这样我就没有差距吗？

谢谢：）