Geek asks and answers

Asp: CheckBox - prohibit nulling text after checkbox

I have a checkbox with text that is quite long, as shown below. One thing we don’t want is text that you can wrap below this check box. What I did to fix this is to put spaces. In addition, this part of the text is not highlighted either:

     <asp:CheckBox ID="chkOption1" runat="server" /> <b><u>Option 1</u></b> - Attend in person. This is the best way to gain critical knowledge and express your thoughts and opinions.<br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Ample time will be provided for individual discussions during breaks and at the networking reception.

Is there a way so that the text doesn't wrap beneath the checkbox and still has the audacity in the text I need?

Please note: I still want the text to be wrapped, but not lower than this check box. This means that it should be wrapped below the previous line text.

+3
source share
3 answers

, , span nowrap :

<span style="white-space: nowrap;">
<asp:CheckBox ID="chkOption1" runat="server" /> <b><u>Option 1</u></b> - Att ........
</span>

, style :

<asp:CheckBox runat="server" ID="chkOption1" style="white-space: nowrap;" Text="too long text" />

html .

+2

. :

  • CheckBox
  • CheckBox float: left
  • display: table
+2

I just found a solution: the key should use display: table and display: table-cell.

Here is the asp.net code:

<asp:CheckBox ID="..." runat="server" CssClass="mobilesubtitle" />

and the html code (corresponding parts) is created here:

<span class="mobilesubtitle">

  <input type="checkbox" name="..." id="...">

  <label for="...">text</label>

</span>

All you have to do in css:

span.mobilesubtitle {
    display: table;

}
span.mobilesubtitle > input{
    display: table-cell;

}


span.mobilesubtitle > label {
    display: table-cell;
    vertical-align: top;
}

inline-table also works.

0
source

More articles:


All Articles