Выравнивание заголовков HTML-таблиц

Question

Я пытаюсь разместить мои заголовки HTML-таблиц с использованием свойства width, и это значит, что они полностью игнорируются.

Заголовок «Тип компании» разделяется на две линии, и это тоже тип занятости? У меня нет таблицы css в моем файле css. Какие свойства можно использовать для получения каждого заголовка с выравниванием по левому краю и следующего заголовка для начала WIDTH-пикселей с начала предыдущего заголовка?

<thead style='float:left;'> 
<tr> 
    <th style='width:270px;text-align:left;'>Company</th>  <th style='width:150px;text-align:left;'>Company Type</th> <th style='width:80px;text-align:left;'>Employment Type</th> 
     </tr> 
</thead> 

Answer 1

<thead style='text-align:left;'> 
<tr> 
    <th style='width:270px;'>Company</th> 
    <th style='width:150px;text-align:left;'>Company Type</th> 
    <th style='width:80px;text-align:left;'>Employment Type</th> 
</tr> 
</thead> 

Попробуйте это и убедитесь, что вы дали ширину всем элементам заголовка, а общая ширина не превышает ширину стола.

Answer 2

Я никогда не надежно получал ширину th и td; не на 100% уверены, что они предназначены.

Обычно я просто кладу div внутри ячейки и даю ширину. Кроме того, добавьте отступы слева и справа на th и td.

Answer 3

В бестабличные образом вы могли бы добиться этого с помощью этого:

<div style="width:270px;float:left;"> 
Company 
</div> 

<div style="width:150px;float:left;"> 
Company Type 
</div> 

<div style="width:80px;float:left;"> 
Employment Type 
</div> 

Конечно, вы можете стиль это вверх легко с вашими предпочтениями, и я бы держать стили в отдельном файле CSS.

Answer 4

Вы можете попробовать 'Nowrap' - но оно не поддерживается в HTML5

<th style='width:270px;text-align:left;'>Company</th>  
<th style='width:150px;text-align:left;' nowrap>Company Type</th> 
<th style='width:80px;text-align:left;' nowrap>Employment Type</th>