Jak mogę zmusić dwa elementy, aby zawsze pozostać w tym samym wierszu w <td>

Question

kod jest dość prosty:

<table id="tabel_user" style="width: 100%; border: 0; background-color: white;" cellpadding="0" cellspacing="0"> 
<tr> 
    <td style="border: 0; padding: 0; padding-left: 5px;"> 
     <label for="abcd"><input class="check_useri" id="abcd" name="abcd" type="checkbox" /> abcd </label> 
    </td> 
</tr> 
</table> 

one zostać starannie na tej samej linii, chyba że tekst na etykiecie robi się naprawdę długo i stół musi się rozciągnąć, aby go pomieścić, a następnie tekst jest czasami wymuszany poniżej pola wyboru. Jak mogę to powstrzymać?

Answer 1

Można wymusić elementów inline, aby pozostać na tej samej linii za pomocą właściwości CSS white-space:

<td style="white-space:nowrap;"> 
    this content will not be wrapped 
</td> 

Answer 2

Definiowanie white-space może być jedną z okazji, aby to zrobić, ale jak tabelarycznym danych, że lepiej jeśli ustalić maksymalną wielkość szerokości etykiety zamiast

label { width: 100px; display: inline-block; } 

Answer 3

można to wykorzystać: <tr valign="top"> uczyni pionowy align na szczycie.

Answer 4

Ten kod działa poprawnie i jest czuły:

table { 
width:100%; 
display: inline-block; 
} 
td, th { 
max-width:100% 
}