Hello. Site is built on bootstrap. On lg screens it looks great, indented between pictures. On md type monitors it looks disgusting - blocks without indents merge. Here you can check .

 @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/index?id=@Model.ParentId" 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/@item.Metod?id=@item.Id" class="info">Смотреть</a> </div> </div> </td> </tr> <tr> <td> <p style="margin-top:15px;text-align:center;"><a class="index-link" href="/@item.Controller/@item.Metod?id=@item.Id">@item.Title</a></p> </td> </tr> </table> </div> } </div> </div> <div class="col-md-5"> </div>

    1 answer 1

    Bootstrap should have been better studied. you need to use the offset class for indents with the appropriate col_md (in the case for layout for laptops). And also choose the right container.

      Protected by the spirit of the community ♦ 11 Mar '16 at 7:26 .

      Thank you for your interest in this issue. Since he collected a large number of low-quality and spam responses, which had to be deleted, now it’s necessary to have 10 reputation points on the site (the bonus for account association is not counted ).

      Maybe you want to answer one of the unanswered questions ?