CheckboxList для отображения выровнены? - PullRequest
Новая
       19

CheckboxList для отображения выровнены?

1 голос
/ 27 апреля 2010

Я создал CheckboxList, и он не будет выстраиваться. Я не вижу способа контролировать сгенерированный HTML. Прямо сейчас флажки не выравниваются из-за ширины <td> каждой метки флажка, являющейся автоматической шириной. Как я могу установить ширину этого и заставить все метки и флажки появляться в двух вертикально выровненных столбцах?

Мой код прост: 

<div style="text-align: center;">
    <p>
    Here you will tell..
    </p>
    <asp:CheckBoxList runat="server" ID="cbl" Width="300px"></asp:CheckBoxList>
    <br />
    <input type="button" id="next_3" value="Next Page" />
</div>

А вот снимок экрана

альтернативный текст http://img718.imageshack.us/img718/6824/checkboxlist.png

Ответы [ 4 ]

8 голосов
/ 27 апреля 2010

Вы можете поместить его в другой <div>, который выполняет выравнивание по левому краю следующим образом: 

<div style="text-align: center;">
    <p>Here you will tell..</p>
    <div style="text-align: left; width: 50%; margin: auto;">
        <asp:CheckBoxList runat="server" ID="cbl" Width="300px"></asp:CheckBoxList>
    </div> 
    <input type="button" id="next_3" value="Next Page" />
</div>
2 голосов
/ 03 августа 2011

Без использования DIV и других элементов и фиксированных размеров. Мы можем выровнять текст checkboxlist, установив « float: left » для типа ввода списка флажков в ксс 

Please check the following example code:
========================================

.CheckboxList
{

    font-size:14px;
    color:#333333;

}
.CheckboxList input
{
    float:left;
    clear:both;
}

.Aspx Code:
===========

<asp:CheckBoxList runat="server" ID="chlCities" RepeatColumns="2" CssClass="CheckboxList"></asp:CheckBoxList>
2 голосов
/ 05 июля 2010

Просто добавьте следующее в ваш чекбокс

Style = "текст-ALIGN =" левый"; 

<asp:CheckBoxList ID="CheckBoxList1" runat="server" TextAlign="Right" Style="text-align='left';"
                                        RepeatColumns="10" RepeatDirection="Vertical" CellSpacing="20">
0 голосов
/ 27 апреля 2010

Может быть, я не понимаю ваш вопрос, но для меня это прекрасно работает: 

<table>
    <tr>
        <td><input type="checkbox" name="cb1" id="cb1"><label for="cb1">Checkbox 1</label></td>
    </tr>
    <tr>
        <td><input type="checkbox" name="cb2" id="cb1"><label for="cb2">Checkbox 2</label></td>
    </tr>
    <tr>
        <td><input type="checkbox" name="cb3" id="cb1"><label for="cb3">Checkbox 3</label></td>
    </tr>
    <tr>
        <td><input type="checkbox" name="cb4" id="cb1"><label for="cb4">Checkbox 4</label></td>
    </tr>
    <tr>
        <td><input type="checkbox" name="cb5" id="cb1"><label for="cb5">Checkbox 5</label></td>
    </tr>
</table>

Если вы можете указать или показать свой HTML-код, возможно, мы сможем вам помочь.

...