Заполнение нескольких div в цикле

Question

У меня есть вкладка с несколькими флажками (потенциально больше, чем я здесь показал). Я создаю флажки в цикле, как это:

<div id="mechanical" class="tabcontent">
    <% for (int i = 0; i < Model.MechanicalRisks.Count; i++)
       {%>
    <%= Html.CheckBoxFor(x => x.MechanicalRisks[i].IsChecked)%>
    <%= Html.DisplayFor(x => x.MechanicalRisks[i].Text)%>
    <br />
    <%} %>
    <br />
    Other:
    <br />
    <%= Html.TextAreaFor(x => x.OtherMechanical, new { style = "width:100%;" })%>
</div>

Это выглядит так:

Мне не нравится, как флажки продолжаются вниз по левой стороне. Я бы предпочел, чтобы они были в нескольких столбцах, поэтому, если бы там было, скажем, двадцать ящиков, это было бы не глупо. Если бы мне нужно было создать несколько элементов div для столбцов внутри вкладки, как бы мне было разделить флажки между элементами div?

Answer 1

Это скорее проблема стилей, чем проблема C # / ASP.NET MVC 2

<ul>
<% for (int i = 0; i < Model.MechanicalRisks.Count; i++) {%>
<li>
    <%=Html.CheckBoxFor(x => x.MechanicalRisks[i].IsChecked)%>
    <%=Html.DisplayFor(x => x.MechanicalRisks[i].Text)%>
</li>
<%} %>
</ul>
<br />
Other:<br />
<%= Html.TextAreaFor(x => x.OtherMechanical, new { style = "width:100%;" })%>

Затем создайте новый стиль или создайте из #mechanical

#mechanical li
{
    float: left;
    width: 50%;
    padding: 0;
    margin: 0;
    list-style: none;
}

Answer 2

Добавьте два div каждый для отображения столбца, внутри каждого div есть цикл for.Первый цикл отображает первую половину записей, а второй цикл отображает вторую половину записей.