In most modern browsers, you can now specify:
My 100px headerMy 200px headerMy 145px header
100px is all you get - anything more hides due to overflow.200px is all you get - anything more hides due to overflow.100px is all you get - anything more hides due to overflow.Then if you apply the styles from the posts above, as follows:
table {
table-layout: fixed; /* This enforces the "col" widths. */
}
table th, table td {
overflow: hidden;
white-space: nowrap;
}
The result gives you nicely hidden overflow throughout the table. Works in latest Chrome, Safari, Firefox and IE. I haven't tested in IE prior to 9 - but my guess is that it will work back as far as 7, and you might even get lucky enough to see 5.5 or 6 support. ;)