Let's say I have an html table with a css declared width of 750px. It has 5 columns and each column has a width of 50px, declared using css (all td's have a 50px width). Obviously, the sum of the columns' widths is 250px which is less than 750px.
When the browser renders the table, each column has a different computed width. I have one column which has 5 spaces only but a computed width of over 100px ( a lot more than 5 's).
All columns fit their included text plus some extra blank spaces. No hard coded column widths are in the markup. Just a single 50px in the css for the 'td'.
How does the browser compute the rendered width of each column?
When you set the width of table columns, it's just a recommended minimum width, that the browser tries to honor if possible. The actual width of the columns are calculated from the size of their content, dividing the leftover space evenly between the columns.
If any of the columns would end up narrower than the width that you specified, the browser would try to adjust it if there is free space in other columns, but in your case the columns are already over the minimum.
The actual algorithm to calculate the cell sizes differs from browser to browser, which means that the columns will end up slightly different depending on what browser you use.