div显示在错误的位置

Question

我有一个包含两个嵌套的div。其中一个嵌套div包含一个javascript图表。

当页面呈现时，javascript图形位于该区域之外的不正确位置。有谁知道我做错了什么？

这里是CSS：

#graph_container{ 
    width: 75%; 
    margin: 0 auto; 
    background-color: #FFF; 
    padding: 20px 40px; 
    border: solid 1px black; 
    margin-top: 20px; 
} 

#graph{ 
    width: 75%; 
    margin-top: 20px; 
} 

#car_select{ 
    width: 25%; 
    margin: 0; 
    background-color: #FFF; 
} 

而且Rails.ERB文件

<div id="graph_container"> 
    <div id="car_select"> 
    # this part is at the correct location...  
    </div> 

    <div id = "graph"> 
    # this is showing up outside of graph_container 
    <script type="text/javascript" language="javascript"> 
    //<![CDATA[ 
    var chart = new AnyChart('/AnyChart.swf'); 
    chart.width = 500; 
    chart.height = 500; 
    chart.setXMLFile('car_info.xml'); 
    chart.write(); 
    //]]> 
    </script> 
    </div> 
</div> 

Answer 1

帕特和丹尼的建议对输出是有效的和重要的。但是，这两个问题都没有解决我的问题，原来的问题实际上是Javascript代码。我没有设置代码插入的位置。

简单地放置在我想要的元素不工作。在我的情况下，我需要做的是用chart.write（'graph'）填充chart.write（），以便脚本将自己插入到html部分。

Answer 2

您是否尝试过做定位绝对？

http://cssdesk.com/EUYhZ

Answer 3

你可以得到<div> S IN正确的地方与2个修复：

1. 浮法他们左，右分别。
2. 在它们下面添加一个清除元素，使它们留在#graph_container中。

你可以看到它in action here。

如果这不起作用，您的Javascript可能会将它创建的图表上的位置设置为绝对。在这种情况下，将position: relative;添加到您的#graph容器。这将导致任何绝对定位的孩子（即图）使用它而不是文档作为其坐标系。