Я пытаюсь сделать сетку таким образом, чтобы она всегда была одинакового размера (800x600).
Однако я не хочу, чтобы все квадраты в сетке были одинакового размера.

, как вы можете видеть, как только я сделаю один квадрат больше (2x2 + зазор - цветное серебро на изображении), все остальные меньшие квадраты не выравниваются и не начинаютсяот начала следующей строки - создание БЕЛЫЙ пробел во второй строке.
есть ли способ это исправить?
вот CSS для них:
.squareTEST1, .squareTEST2
{
width: 60px;
height: 60px;
margin: 3px;
float: left;
}
.squareTEST1A
{
width: 126px;
height: 126px;
margin: 3px;
float: left;
background-color: Silver;
}
.squareTEST1
{
background-color: Red;
}
.squareTEST2
{
background-color: Blue;
}
спасибо за любую помощь edit попробуйте здесь: http://jsfiddle.net/NF9N9/
примечание: могут быть другие квадраты разных размеров 3x3 и 4x4, но большинство будут 1x1.,просто хочу сделать идеальную сетку без пропусков.это должно быть динамическим, то есть любой квадрат может быть взорван в любой позиции, но в итоге он должен получить компактную сетку.
-
не связано (НИЗКИЙ ПРИО) - но если кто-нибудь знает лучший способ разделить сетку 800x600 на 12 столбцов на 9 строк (-1 или 2 строки или столбца - я могу жить с немного большими квадратами), который заканчивается 800x600 и имеет пробелы и размеры, делимые на 5, я 'буду благодарен: P