Question

I am trying to create table where two of the columns are the smallest width needed to contain the content, and the third column would be as wide as possible. I do know how wide the two columns will be and they wont change that much, but I would rather as little hard-coded widths as possible.

Here is what I got:

​<table width="100%">
    <tr>
        <td align="left" style="width:auto;">
            123 123 123 123 123
        </td>
        <td align="center">
            bla bla
        </td>
        <td align="right" style="width:auto;">
            hello
        </td>
    </tr>
</table>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

The first and last columns take more space than needed causing the middle column to not look centered. Is there a way to do this or should I just hardcode the widths?

Edit: The answer is so simple. Here is the full answer in case it helps anyone else:

​<table width="100%">
    <tr>
        <td align="left" style="white-space:nowrap;">
            123 123 123 123 123
        </td>
        <td align="center" width="100%">
            bla bla
        </td>
        <td align="right">
            hello
        </td>
    </tr>
</table>​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​​

Answer 1

Well you have your table set to 100% width.. it must expand something 🙂