Авто ширина на столах

Question

Столбцы и строки HTML-таблицы генерируются динамически,

Т.е. для первого экземпляра это могут быть две строки и столбцы. и в следующий раз это может быть две строки и 10 столбцов

У меня вопрос, как автоматически настроить таблицу так, чтобы таблица всегда отображалась на странице 100%, регулируя размер кулона и размер строки

    <table>
    <tr><td></td><td></td><td></td></tr>
    <tr><td></td><td></td><td></td></tr>
    </table>

    <table>
     <tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
     <tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
     <tr><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td></td></tr>
  </table>

Спасибо ..

Answer 1

Использование CSS:

<style type="text/css">
table { width: 100%; }
</style>
<table>
...
</table>

или с использованием встроенного стиля CSS:

<table style="width: 100%">
...
</table>

или с использованием старой школы HTML:

<table width="100%">
...
</table>

Answer 2

Помещенный

ширина = "100%"

В вашем табличном теге - это всегда будет ширина 100%. Это то, что вы имели в виду?

Answer 3

Лучшее, что я знаю на данный момент, это:

.my-table-class {
   box-sizing: border-box;
   width: 100%;
}

Если вы не используете box-sizing: border-box;, вы получите плохие результаты, как только ваша таблица будет иметь отступы и границы. Использование width: 100%; недостаточно.

Подсказка: то же самое для элемента с display: table;.

Answer 4

Вы можете попробовать использовать CSS-файл, в котором вы можете написать

table {
  width: 100%;
  height: 100%;
}

Или вы можете добавить следующие строки в ваш HTML-файл

<style type="text/css">
  table { width: 100%; height: 100%; }
</style>