Sometimes you may not always want your columns to be the same size. If this is the case, you need to set values on your table data <td> cells. Again, you can set them by using percentages or pixel widths.
<table width="300" border="2">
<tr> <td width="70%"> A</td> <td>B</td> <td>C</td> </tr>
<tr> <td width="70%"> X</td> <td>Y</td> <td>Z</td> </tr>
</table>
This is what this table would look like.
| A | B | C |
| X | Y | Z |
See how the column width for the first column in both rows is set to 70%. Notice there is no value set for the other 2 columns. If you do not set a value for the remaining columns, their width will automatically be adjusted to take up the remaining space and they'll share it equally.
Since the table width is set to 300 pixels, and the first column is instructed to take up 70% of those 300 pixels (roughly 210 pixels), the other 2 columns divide the remaining 30% of the table (roughly 45 pixels a piece).
You could also have expressed the column widths of this table in pixels instead of percentages.
The code would have looked like this:
<table width="300" border="2">
<tr>< td width="210" >A</td> < td width="45" >B</td> < td width="45" >C</td> </tr>
<tr>< td width="210" >A</td> < td width="45" >B</td> < td width="45" >C</td> </tr>
</table>
| A | B | C |
| X | Y | Z |
See how the width of the columns in each row add up to 300 (210 + 45 + 45) -- which is the width of the table.
Many people prefer to express their table width and column widths in percentages because that will ensure that the table takes up the same amount of screen no matter how big or small the screen resolution is.
If someone is using a 21 inch monitor to view your site and you have a table width set to 300 pixels, the table will show up very small on their screen. However if you set the table width to 70%, it will take up 70% of the screen no matter what size the person is using.
So it's really up to you to decide what's the best layout for your tables.
Lesson # 17 : HTML Tutorial - Specifying a Table's Height