Ограничение ширины стола

Question

У меня есть HTML-таблица, ширина которой не может превышать 700 пикселей, и я не знаю, сколько будет столбцов (от 3 до 10). Я хочу, чтобы все элементы <th> имели отступ 5px, но это увеличивает ширину таблицы и заставляет элемент div, в котором она находится, отображать горизонтальные полосы прокрутки.

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

Помещение значения переполнения в div не имеет смысла, поскольку оно просто затеняет столбцы за 700px.

Есть ли способ обойти это, установить правильный жесткий предел ширины стола?

Answer 1

Используйте CSS, указанный ниже, и это не позволит вашей таблице превысить заданный вами максимальный размер:

table{
  table-layout:fixed;
}

Answer 2

Установить ширину таблицы на 100% и ширину родительского элемента в 700px.

Answer 3

Лучшее из возможных решений - это то, которое вы используете сейчас.

Поскольку вы не можете предсказать количество столбцов, вы не можете установить ширину для каждого столбца. Поэтому установка переполнения родительского div на auto и ширина дочерней таблицы на 100% - лучшее решение.

Answer 4

На что вы устанавливаете отступ?

Если вы установите ширину таблицы и отступ для td , вы сможете получить именно то, что вам нужно.