Nowrap/Nie przerywaj linii po wprowadzeniu

Question

Jeśli mam kilka wejść (radio lub opcja), a następnie ich etykietę, wszystkie w tej samej linii. Jak ja to robię, żeby nie łamać linii za radiem, ale w razie potrzeby przerwać po etykiecie.

<input type="radio" id="i1"/><label for="i1">First radio</label> 
<input type="radio" id="i2"/><label for="i2">Second radio</label> 
<input type="radio" id="i3"/><label for="i3">Third radio</label> 

mogę myśleć owijania zarówno input i label w span z nowrap, ale zastanawiam się, czy istnieje inny sposób.

Answer 1

To powinno załatwić sprawę:

#MyDiv {width: 250px;}

<div id="MyDiv"> 
 
    <nobr><input type="radio" id="i1"/><label for="i1">First radio</label></nobr> 
 
    <nobr><input type="radio" id="i2"/><label for="i2">Second radio</label></nobr> 
 
    <nobr><input type="radio" id="i3"/><label for="i3">Third radio</label></nobr> 
 
</div>

<nobr> tag zapewni przerwę nie stanie pomiędzy przyciskiem i etykiety.

Sposób CSS jest również możliwy, owijanie go innym <span> i używanie white-space: nowrap; powinno działać dobrze.

Answer 2

myślę, że to jest to, czego szukasz: http://jsfiddle.net/catalinred/kNUaz/

Answer 3

Nic nie pracował dla mnie (lub przynajmniej tak myślałem, dopóki nie naprawił) ... dlatego Moja brudna rozwiązaniem było użycie tabel , 1 wiersz, wiele kolumn. Może być konieczne dostosowanie dopełnienia/odstępu.

Edytuj: Ostrzeżenie to zły sposób robienia rzeczy, ale jeśli nic nie działa, może to pomóc.

     <table border="0" > 
          <tbody> 
          <tr> 
           <td><input name="gender" type="radio" value="male" checked> Male </td> 
           <td><input name="gender" type="radio" value="female"> Female </td> 
          </tr> 
          </tbody> 
         </table>