Щоб встановити ширину таблиці у пікселях або у відсотках, використовуйте стильову властивість 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. Ширина таблиць
При використанні стилів для вказівки ширини таблиці можна застосовувати будь-які допустимі одиниці вимірювання, а не тільки пікселі та відсотки.