Здравствуйте. Сайт сверстан на bootstrap.
На lg
экранах смотрится прекрасно, с отступом между картинками. На мониторах типа md смотрится отвратно - сливаются блоки без отступов. Вот тут можно проверить.
@model Site.Models.MebelModel
@{
ViewBag.Title = Model.Title;
}
@if (Model.Id!=0)
{
<ul class="breadcrumb" style="margin-top:10px;">
<li><a href="/home/index" style="color:#ff6a00;">Вся мебель</a> <span class="divider"></span></li>
@if (Model.Level>=2)
{
<li><a href="/home/[email protected]" style="color:#ff6a00;">@Model.Name</a> <span class="divider"></span></li>
}
<li class="active">@ViewBag.Title</li>
</ul>
}
<div class="col-md-1">
</div>
<div class="col-md-6">
@if (Model.Id != 0)
{
<h2 class="zagolovok">@ViewBag.Title</h2>
}
<div class="row">
@foreach (var item in Model.CatalogList)
{
<div class="col-sm-3 col-md-3 col-lg-3" style="margin-left: 8.333333333333332%;">
<table>
<tr>
<td>
<div class="view view-tenth">
<img class="img-thumbnail" style=" box-shadow: 10px 10px 10px 0px #909090;" src="../Content/Images/@item.SmallImage" />
<div class="mask">
<h2>@item.Caption</h2>
<p>@item.UnderLine</p>
<a href="/@item.Controller/@[email protected]" class="info">Смотреть</a>
</div>
</div>
</td>
</tr>
<tr>
<td>
<p style="margin-top:15px;text-align:center;"><a class="index-link" href="/@item.Controller/@[email protected]">@item.Title</a></p>
</td>
</tr>
</table>
</div>
}
</div>
</div>
<div class="col-md-5">
</div>