Как задать ширину таблицы?

Чтобы установить ширину таблицы в пикселях или в процентах используйте стилевое свойство width, применяя его к селектору table, как показано в примере 1.

Пример 1. Ширина таблицы

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Ширина таблицы</title>
  <style>
   table {
    border: 1px solid #333; /* Рамка вокруг таблицы */
    margin-bottom: 1em; /* Отступ снизу */
   }
   table.tbl1 {
    width: 100%; /* Ширина таблицы в процентах */
   }
   table.tbl2 {
    width: 300px; /* Ширина таблицы в пикселях */
   }
  </style>
 </head>
 <body>
  <table class="tbl1">
   <tr>
    <td class="col1">Колонка 1</td>
    <td class="col2">Колонка 2</td>
   </tr>
  </table>
  <table class="tbl2">
   <tr>
    <td class="col1">Колонка 1</td>
    <td class="col2">Колонка 2</td>
   </tr>
  </table>
 </body>
</html>

Результат данного примера показан на рис. 1. Для первой таблицы ширина задана как 100% и таблица занимает всю ширину окна браузера. Для второй таблицы ширина фиксирована и задана как 300 пикселей.

Как задать ширину таблицы?

Рис. 1. Ширина таблиц

При использовании стилей для указания ширины таблицы можно применять любые допустимые единицы измерения, а не только пиксели и проценты.

Автор: Влад Мержевич
Источник webref.ru