1

我们使用一个非常简单的页眉/正文/页脚布局：

...
<body>
<div id="container">
<div id="head">[header content goes here]</div>
<div id="body">[content goes here]</div>
<div id="foot">[footer content goes here]</div>
</div>
</body>
...

然后 css 只是确保页脚始终位于底部：

html, body {margin:0;padding:0;height:100%;}
#container {min-height:100%;position:relative;}
#body {padding:10px;padding-bottom:2em;zoom:1;}
#head {padding:10px;}
#foot {position:absolute;bottom:0;width:100%;height:1em;}

这工作得很好......直到我们向页面添加一个 AnyChart 图表，也就是说。在我们这样做的那一刻，页脚不是位于页面底部，而是一个空白条纹，其高度与页面底部的页脚完全相同，然后页脚位于该空白条纹上方。

以下是使用“宽”样式表的页面上的问题，该样式表使用浏览器的全宽作为内容： 没有背景图像的额外底部边框

这是使用“漂亮”样式表的页面上的样子，它添加了背景图像和侧边距以让所述图像显示出来： 带有背景图像的额外底部边框

我可以通过在#container 上设置负边框底部来缩小空间，但我真的想知道它来自哪里，这样我就可以修复错误而不是治疗症状。

我无法让 AnyChart 咳出版本信息。我知道这不是最新版本：它仍然使用广泛的 xml，用于模板和图表数据，而我相信最新版本主要转移到 JSON（或类似的东西）。在我们的版本中，我们添加到AnyChart.jsand的链接AnyChartHTML5.js，然后执行类似这样的操作来定义一个图形（带有 VBScript 的经典 ASP，如果有人关心的话）：

<%
chartData = "<anychart><templates path=""../js/AnyChartTemplates.xml""/>"
chartData = chartData & "<charts><chart template=""relbar"">"
chartData = chartData & "<data><series><point name=""Question 1"" y=""4.5"" />"
chartData = chartData & "<point name=""Question 2"" y=""8.23"" />"
...
chartData = chartData & "</series></data><chart_settings>"
chartData = chartData & "<axes><y_axis><scale maximum=""10"" /></y_axis></axes>"
chartData = chartData & "</chart_settings></chart></charts></anychart>"
%>
<div id="mychart"></div>
<script type="text/javascript" language="javascript">
    AnyChart.renderingType = anychart.RenderingType.SVG_PREFERRED;
    var chart = new AnyChart("../swf/Chart.swf");
    chart.setData('<%=chartData%>');
    chart.write("mychart");
</script>

再次，我想强调的是，样式在每个没有 AnyChart 图形的页面上都能完美运行，所以问题一定出在 AnyChart 所做的事情上。我知道此版本的 AnyChart 还有其他错误，例如，如果您在页面上有多个图表，它会添加一个iframe元素，它试图隐藏但在这样做时惨遭失败（作为一种解决方法，我们的 AnyChart css 有line iframe {display:none;}，只要我们不想在同一页面中实际使用 iframe 作为图表，它就会起作用）。我希望有人知道 AnyChart 添加的其他多余元素或样式会导致底部边距效果，因此我可以隐藏或禁用它。

4

0 回答 0