Square tiles with CSS

Question

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

I wanted to fill whole DIV with my squares. Im going to implement a bit more of them, but I have no idea how to fix the gaps. I want to add more of them, just to make it look really cool. I think it explains everything..

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;}

Got any idea how to merge everything together so I can have no gaps?

Thanks :)

I think you can find the answer here [http://stackoverflow.com/questions/8470070/how-to-create-grid-tile-view-with-css](http://stackoverflow.com/questions/8470070/how-to-create-grid-tile-view-with-css) — Sreelal P Mohan, Jul 05 '15 at 11:30

Square tiles with CSS

0 Answers0