#twitter-bootstrap
#twitter-bootstrap
Вопрос:
Я новичок в Bootstrap и надеюсь, что допустил какую-то глупую ошибку, но у меня проблема со столбцами в Chrome. Он отлично работает в Firefox и IE.
Это мой класс столбцов:
col-lg-2 col-md-4 col-sm-6
Итак, у меня должно быть 6 столбцов на большом дисплее, 3 на среднем, 2 на маленьком…
Это макет:
@{string classLabel = "col-lg-3"; string classData = "col-lg-9"; string classCol = "col-lg-2 col-md-4 col-sm-6"; }
<div class="container-fluid">
<div class="@classCol">
<div class="@classLabel">@Html.LabelFor(m => m.CountryOriginCode)</div>
<div class="@classData"> @Html.DropDownListFor(m => m.CountryOriginCode, (IEnumerable<SelectListItem>)ViewBag.CountriesList)</div>
</div>
... more columns
here are the wrong displaying columns - first OK, second wrong
<div class="@classCol">
<div class="@classLabel">@Html.LabelFor(m => m.RES_RolePrimaryID)</div>
<div class="@classData">
<select name="RES_RolePrimaryID" id="RES_RolePrimaryID">
@foreach (var item in RES_Roles.GetRolesList())
{
<option value="@item.RoleID">@item.Name</option>
}
</select>
</div>
</div>
<div class="@classCol">
<div class="@classLabel">@Html.LabelFor(m => m.RES_RoleSecondaryID)</div>
<div class="@classData">
<select name="RES_RoleSecondaryID" id="RES_RoleSecondaryID">
@foreach (var item in RES_Roles.GetRolesList())
{
<option value="@item.RoleID">@item.Name</option>
}
</select>
</div>
</div>
</div>
С чем я сталкиваюсь, так это с тем, что после второй строки (есть 2 выбора) второй выбор должен начинаться с новой строки, а затем за ним должны быть другие элементы.
НО он отображается как последний столбец следующей строки и как единственный столбец в этой строке.
Я пытался определить, что не так, проверив CSS в Chrome, много раз просматривая код, но все еще не могу поместить его в начало строки
у кого-нибудь есть какие-либо предложения?
вот изображение: