Делаю сайт на ASP .NET MVC + MSSQL вывожу на страничку записи из БД и они как полагаются распространяются сверху в низ, мне же нужно - если очередная запись из БД не помещяется на экран ( например, по высоте окна браузера) то перенос правее.
Скриптом могу определить размер экрана браузера пользователя и размер ячейки <td>. Картинки какой сечас вывод
Разметка:
<table class="wall" id="labelwall" >
<tr>
<td> @*line-height: 0px; font-size: 0px;*@
@{
if (string.IsNullOrWhiteSpace(Model.CoverImage))
{
<img src="@Url.Content("~/Content/CoverImage/0.jpg")" alt="CoverImage" id="img0" />
}
else
{
<img src="@Url.Content("~/Content/CoverImage/" + User.Identity.Name + "/CoverImage" + Model.CoverImage)" alt="CoverImage" id="img" />
}
}
</td>
<td>
<br /><br />
@using(Html.BeginForm("PostLabel","LabelWall")){
@Html.TextArea("Label", new { style="width: 250px; height: 150px; position: relative; resize: none;" })
<br /><br />
<input type="submit" value="Разместить" />
}
@foreach(var x in Model.PersonalLabel)
{
if(x.PersonalID==ViewBag.PersonalGuid)
{
<br /><br />
<table class="InternalLabel"> @*если что взять за основу ( помешяется ли в экран) ид из этой талицы id="internalLabel"*@
<tr>
<td>@{ Html.RenderAction("MiniAvaImage", "Home"); }</td>
<td style="font-size: 12px;">
@ViewBag.FullName<br />
@x.LabelWall.Date.Value.ToLongDateString()
</td>
</tr>
<tr>
<td colspan="2" style="padding: 2px;">@x.LabelWall.Text</td>
</tr>
</table>
}
}
</td>
<td>
<br /><br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa
<br /><br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa
<br /><br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa <br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
<br /><br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa
<br /><br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaffffffffffffaaa< br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaffffffffffffffff aaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaafffffffffffffffaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaafffffffffffffffff ffaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaafffffffffffffaaaa <br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaffffffffffaaaaa
@*</td><td>*@
<br /><br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaa
</td>
<td>
<br /><br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa
</td>
<td>
<br /><br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa<br />
adasdasdadasdadasdaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa aa
</td>
</tr>
</table>
<script type="text/javascript">
height = $(window).height();
img.style = "height: " + height + "px";
img0.style = "height: " + height + "px";
</script>
Как собственно реализовать скрипт для всей этой балды.