Auto width on tables

A html table cols and rows are generated dynamically,

i.e, for the first instance it could be two rows and there columns. and next time it could be two rows and 10 columns

My question is how to adjust the with automatically of the table so that the table always appears 100% in the page adjusting the coulmn size and row size

    <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>开发者_如何学C;</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>

Thanks..

Using CSS:

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

or using a CSS inline style:

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

or using old school HTML:

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

Put

width="100%"

In your table tag -- it will always be 100% width. Is that what you meant?

You might try using a css file in which you could write

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

Or you can prepend following lines in your html file

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

The best I know so far, is this:

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

If you don't use box-sizing: border-box;, you will get bad results as soon as your table has paddings and borders. Using width: 100%; is not enough.

Hint: the same for an element with display: table;.