Question

I want to set the column width of a table that is contained in a div. The width of the table can exceed the fixed width div, so I want the div to show a horizontal scrollbar – but the table column won’t expand to the width I’m setting it at. How can I get this to work?

#content {
    width:200px;
    overflow-x: auto;
}
td,th {
   border-style:solid;
}

<div id="content">
<table style="border-style:solid;">
    <tr>
        <th style="width:50px">124</th>
        <th style="width:550px">124</th>
    </tr>
    <tr>
        <td>124</td>
        <td>124</td>
    </tr>
</table>
</div>

Answer 1

You need to use min-width if you want to force the table width.

Here is your example with the scrollbar:
http://jsfiddle.net/CEUVV/