Member Avatar for Eilandor

How to make CheckBox with a long text label without wraping it's checkbox?
Sample:

<div style="width:150px">
     <input type="checkbox"/>
     <label>This is a very long label which should not wrap around checkbox.</label>
</div>

I wish that it should be imaginary vertical line between checkbox and label. Below checkbox it should an be empty space. Text must be left-aligned.
I tried

<div style="width:150px">
     <input style="display:block;float:left;" type="checkbox"/>
     <label style="display:block;float:left;">This is a very long label which should not wrap around checkbox.</label>
</div>

And it works fine in IE 6 (you may see what result I wish) but NOTHIG happens in FireFox 2.
Any idea's?
P.S. No <table> tags please.

  • 2 Contributors
  • 1 Reply
  • 78 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by JonathanD
Member Avatar for JonathanD

try setting float:right; for the label instead of float:left;

OR

try setting a margin-bottom for the input box

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.