谷歌图表API在iPhone上突破容器

我正在使用谷歌的图表API开发一个移动网站。一切都运行得很好，并且可以像在其他测试设备上一样进行扩展，但出于某种原因，当在iPhone上查看时，谷歌的“表格”图表正在脱离其容器。它在缩小的浏览器窗口、Android平板电脑和Galaxy SII上看起来都不错。我已经确认这不是移动Safari的问题

图表通过iFrame加载，并缩放以适应宽度：其容器的100%，即Dreamweaver“流体网格布局——网格容器”元素。柱状图和折线图都可以适当地缩放到100%，但是表格会增长到适合所有内容，然后脱离gridcontainer

在其他设备上，网格显示边界内的内容，并添加滚动

这是将图表绘制到页面的php/html代码

<div id="top-prods" class="chart" style="width: 100%; height: 500px;">
<?php
    if($charts->isData() == "true"){
        echo "<iframe id=\"top-chart\" src=\"controls/charts/top_prods.php?loc=".$loc."&comp=".$company_id;
        if($xDate != "") {echo "&xDate=".$xDate;} 
        if($yDate != "") {echo "&yDate=".$xDate;}
        echo "\" style=\"width:100%;\" scrolling=\"no\"></iframe>";
    }
?>

唯一的css是在Gridcontainer上定义的，因为iFrame应该调整大小以适应容器

---

任何帮助都将不胜感激。

看起来您遇到了与此类似的问题：

第一个答案中的CSS看起来很容易移植