如何获得标签右侧的复选框列表?复选框列表的宽度是多少

本文关键字：列表 复选框 多少 何获得 标签 | 更新日期: 2023-09-27 18:33:38

如何让复选框列表显示在标签的右侧？

下拉列表显示在其标签的右侧，具有类似的代码，但复选框列表显示在标签下方：

<p>
    <asp:Label ID="lblTestVersions" runat="server" Text="Toetsversie:" AssociatedControlID="DropDownListTestVersions"></asp:Label>
    <asp:DropDownList ID="DropDownListTestVersions" runat="server" Width="250" TabIndex="1" >
    </asp:DropDownList>
</p>
<p>
    <asp:Label ID="lblTests0" runat="server" Text="Opties:"></asp:Label>
    <asp:CheckBoxList ID="CheckBoxList1" runat="server" TabIndex="2" Width="200">
        <asp:ListItem Width="200">Option 1</asp:ListItem>
        <asp:ListItem Width="200">Option 2</asp:ListItem>
    </asp:CheckBoxList>
</p>

我试图用几个Width="200"来限制复选框列表的宽度，但这没有帮助。

答案（见下文）是CheckBoxList实际上是一个表，并且将始终转到下一行。

如何获得标签右侧的复选框列表?复选框列表的宽度是多少

只需尝试使用HTML表格，只需将标签保留在一个td中，并将复选框列表保留在另一个td中即可。

CSS： 

#lblTests0 { float: left; display:block; width: 100px; }

例：

<p>
    <label id="lblTests0">Opties:</label>
    <table id="check1">
        <tbody>
            <tr>
                <td><input id="check1_0" type="checkbox" name="check1$0" value="Item 1"><label for="check1_0">Item 1</label></td>
            </tr>
            <tr>
                <td><input id="check1_1" type="checkbox" name="check1$1" value="Item 2"><label for="check1_1">Item 2</label></td>
            </tr>
        </tbody>
    </table>
</p>

预览可在此处找到 http://jsfiddle.net/NMWGh/

相关文章：