CODEWITHSUNDEEP
asp.net
Chaitany Ram
Chaitany Ram

Reputation: 141

Checkbox Label displayed in the next line if width of the label exceeds the limit of the Div tag

I am working with CheckBoxList, the checkbox lables are displayed in the next line if the value exceeds the div tag width.

Is there a way by which i can allign the same on the same line?

  <table id="Table1">
                    <tr>
                        <td width="250px">
                            <asp:Label ID="deleteLabel" runat="server" Text="Select "></asp:Label>
                        </td>
                        <td width="900px">
                            <div style="border-style: solid; border-color: inherit; border-width: thin; overflow: auto;
                                width: 356px; height: 100px" class="ccodes" runat="server" id="deletePanel1">
                                <asp:CheckBox ID="CheckBoxSelectAll" runat="server" Text="All" />
                                <asp:CheckBoxList ID="checkBoxListDeleteEntities" runat="server" RepeatDirection="Vertical"
                                    Height="26px">
                                </asp:CheckBoxList>
                            </div>
                        </td>
                    </tr>   
    </table>

Values are displayed as shown below. (for third value if it exceeds the width of the div (356px))

[] test1
[] test2
[]
test test test test test test test test test test test test test

Any suggestion how to make the checkbox label inline with the checkbox?

Upvotes: 2

Views: 6807

Answers (1)

Tim Schmelter
Tim Schmelter

Reputation: 460068

Have you tried white-space: nowrap?

.nowrap_list tr td label
{
    white-space:nowrap;
    overflow:hidden;
}

<asp:CheckBoxList ID="checkBoxListDeleteEntities"
    CssClass="nowrap_list"
    runat="server" RepeatDirection="Vertical"
    Height="26px">
</asp:CheckBoxList>

Upvotes: 2

Related Questions