Làm thế nào tôi có thể buộc hai yếu tố luôn luôn ở trên cùng một dòng trong một mã <td>

Question

là khá đơn giản:

<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> 

Chúng sẽ ở lại gọn gàng trên cùng một dòng trừ trường hợp văn bản trong nhãn được thực sự dài và bảng cần phải kéo dài để chứa nó, sau đó văn bản đôi khi bị buộc bên dưới hộp kiểm. Làm thế nào tôi có thể ngăn chặn nó làm điều đó?

Answer 1

Bạn có thể buộc các yếu tố nội tuyến để ở trên cùng một đường bằng cách sử dụng CSS tài sản white-space:

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

Answer 2

Xác định một white-space có thể là một trong những cách để làm cho nó thực hiện, nhưng như một bảng dữ liệu, nó tốt hơn nếu bạn điều chỉnh kích thước tối đa của chiều rộng của nhãn thay vì

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

Answer 3

bạn có thể sử dụng này: <tr valign="top"> này sẽ làm cho class dọc ở đầu trang.

Answer 4

Mã này hoạt động tốt, và đáp ứng:

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