How can I make table column widths fixed?

Question

I have a table with two columns, first column 65%, second 35%. It perfectly fits to 100% of screen, if first column has enough text in it to fill that 65%, but if it is empty (or small amount of text) - then first column shrinks and second expands.

How can I make first column ALWAYS 65% of screen, with or without text?

Answer 1

Try this:

<table class="fixed_width">
    <col width="65%" />
    <col width="35%" />
    <tr>
        <td>your data</td>
        <td>your data</td>
    </tr>
</table>

And CSS:

table.fixed_width { table-layout:fixed; }
table.fixed_width td { overflow: hidden; }