Мне нужно нарисовать план зала на сайте. Зал оформлен в сторонней программе. Программа дает мне план зала в виде координат каждого места:
Row Place X Y Widht Height
1 1 10 10 35 35
План в редакторе выглядит так:

У меня есть следующий код для рисования в представлении:
@foreach (var plan in Model.HallPlans)
{
<div class="place" style="left:@(plan.X)px; top:@(plan.Y)px; height: @(plan.Height)px; width:@(plan.Width)px">@plan.Seat</div>
}
Этот код генерирует следующее:

Я хочу уменьшить размер блока div, например, в два раза. Если я разделю Height
и Width
на 2, то это будет выглядеть так:

Размер первых трех строк такой, как я хотел, но широкое место в четырех рядах выглядит не правильно (не до конца ряда.) Как исправить? И как я могу уменьшить пространство между div
?
PS. немного CSS:
div.place {
display: block;
text-indent: -9999px;
margin: 0 0 1px 1px;
position:absolute;
float: left;
border-radius: 2px 2px 2px 2px;
-moz-border-radius: 2px 2px 2px 2px;
}
Спасибо и извините за мой английский.