How to center dynamically changing grid in div?

Crystal

New Member
KMXhW.jpg
I need to create a centered grid of squares with text inside it. With jQuery help user will be able to add or remove squares (in row and column). Basically the code would be:\[code\]<style>div.square{ padding: 5px; margin: 5px; border: 1px solid green; /*display: inline-table; /* IE fail*/ /*display: inline-block; /* IE fail*/ float: left;}div.row{ margin: 0 auto;}</style><div style="width:500px; border:1px solid red; margin: 0 auto"> <div class="row"> <div class="square">1</div> <div class="square">2</div> <div class="square">3</div> </div> <div style="clear:both"></div> <div class="row"> <div class="square">1</div> <div class="square">2</div> <div class="square">3</div> </div> <div style="clear:both"></div> <div class="row"> <div class="square">1</div> <div class="square">2</div> <div class="square">3</div> </div> <div style="clear:both"></div></div>\[/code\]What is the best way to do it?
 
Back
Top