Урок Почему max-width не работает для таблицы?

TaLLeR43

Администраторы
Сообщения
113
Реакции
0
Баллы
48

Задача​

Ограничить максимальную ширину таблицы заданным значением.

Решение​

Свойство max-width не применяется к тегу <table>. Чтобы задать максимальную ширину таблицы создайте тег <div> с ограничениями и в него включите таблицу с шириной 100% (пример 1).

Пример 1. Использование max-width
HTML:
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>max-width для таблицы</title>
  <style>
   table {
    width: 100%; /* Ширина таблицы */
   }
   div {
    max-width: 1000px; /* Ограничиваем ширину таблицы */
   }
  </style>
 </head>
 <body>
  <div>
   <table border="1">
    <tr>
     <td>2012</td><td>2013</td><td>2014</td><td>2015</td>
     <td>2016</td><td>2017</td><td>2018</td><td>2019</td>
     <td>2020</td>
    </tr>
   </table>
  </div>
 </body>
</html>
 
Яндекс.Метрика
Сверху