The table has a width of 100%. It stretches or shrinks to fill the available space in the browser window.
The third option is defining a table width in percent. This means the table width is a percentage of the available space. Typically, the available space is the size of the browser window. But, if the table is nested within another table, then the width is a percent of the available space in that table.
Click the Play button to see an animated example. The animation shows a table that has been given a width of 100%. A few things to observe:
- When the browser window is resized to be wider, the table grows or stretches to fill the available space.
- The table shrinks if the window is resized to be smaller.
- Notice how the text unwraps or wraps depending on how wide the table is.
Some people refer to these tables as "autostretch tables," or even "liquid tables," because they stretch and flow into the available space.
The advantage of this width is that it makes the table flexible. No matter what size the browser window or screen resolution, the table will be visible.
