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

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

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

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

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

Ответы

Ответ 1

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

table{
  table-layout:fixed;
}

Ответ 2

Установите ширину таблицы до 100% и ее родительскую ширину div до 700 пикселей.

Ответ 3

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

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

Ответ 4

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

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