Highcharts charts don't resize properly on window resize
highcharts
Solution
I forked your fiddle to a working solution @ http://jsfiddle.net/AxyNp/ The most important code snippet from there is this:
$(window).resize(function() {
height = chart.height
width = $("#chartRow").width() / 2
chart.setSize(width, height, doAnimation = true);
});
The solution bears on this SO post's answer.
It seems like the best you can do to resize the chart's container (and cell) properly is to rely on your own resize trigger. Note that I set the reflow to "false" in the chart's options to remove the existing trigger.
Problem
I have 2 side-by-side charts on my page, and would like to have them resized when window is resized: their container is set to 50% width, which, according to examples, should be enough. A working example of automatically resizing chart can be found @ http://jsfiddle.net/2gtpA/ A non-working example I did to reproduce the issue can be seen @ http://jsfiddle.net/4rrZw/2/ NOTE: you have to resize the frame several times to reproduce the issue (smaller>bigger>smaller should do) I think it all lies in the way you declare containers... pasting the HTML code as the JS code for highcharts doesn't seem to be relevant here... (same in both examples) ``` <table style="width:100%;"> <tr> <td style="width:50%;"> <div id="container" style="height: 50%"></div> </td> <td style="width:50%;"></td> </tr> </table> ```