Highcharts + Bootstrap .table-responsive Issue

When I put my chart inside of Bootstrap's .table-responsive the chart doesn't fill the entire td. Here's a jsFiddle of the problem. As you might see I've set the width to 100%, and

Solution 1:

You'll have to set the width setting of chart after initialization. After initialization, Highcharts only adapts on a resize event (try it out, if you resize the window it will change width), so you might want to trigger an resize event.

Here is a jsFiddle (ab)using a resize event: http://jsfiddle.net/b9DMn/1/

Highcharts does automatically gets the width of its container when its creating its chart, but if you put a breakpoint there you'll see that the table cells are still divided equally at that point in time. In fact, it is the chart that triggers the table to grow the right cell. If you can fixate the cell width, that would probably help too.

Here is a jsFiddle fixating the width of the cells, so they don't grow and shrink when content gets added: http://jsfiddle.net/b9DMn/2/