在多列布局中，我的高图在Safari中不可见

Question

我已经为此编写了一个小提琴（http://jsfiddle.net/929Zb/5/），将问题减少到演示问题的最小标记...这是我的Highchart没有在Safari中呈现（版本5.1.7 on Windows，但我也在MacBook上以最新版本运行它。）

我的要求是小部件的多列布局，如此屏幕截图所示，来自Chrome中的小提琴：

这是在Safari中运行的相同内容：

Safari已经渲染了SVG，并在调试中将鼠标悬停在它上面突出显示HTML中的蓝色元素，但它无法看到!!

我用来显示列的CSS如下所示。如果您将列数从2更改为1，则图表在Safari中显示正常!!

.widget-container
{
    -webkit-column-count: 2;
    -webkit-column-gap: 2em;
    -moz-column-count: 2;
    -moz-column-gap: 2em;
    column-count: 2;
    column-gap: 2em;
}
.widget {
    /* This is required to keep the widget div's together and not break them over columns  */
    -webkit-column-break-inside: avoid;
    -moz-column-break-inside: avoid;
    column-break-inside: avoid;
margin-bottom: 2em; 
}

是否会对CSS进行更改以使Safari正常工作，还是需要修复javascript？我思索这是否与CSS过渡有关，所以尝试关闭动画，但鉴于它仍然是动画我明显错误的语法。我有一个时间限制这个问题，所以我现在发布，但如果我有任何进展，将报告。

Answer 1

我认为这是一个CSS问题，在任何不同于第一列的列中显示图表。如果禁用colum-break-inside，它也可以。

我可以建议禁用图表容器的位置：http://jsfiddle.net/929Zb/17/

.highcharts-container {
    position: inherit !important;
}