如何在行中顯示Highcharts（5）

Question

我是新來的CSS，所以請原諒，如果這是一個愚蠢的問題。

這是我的jsfiddle

http://jsfiddle.net/7cvCX/157/

我需要dsplay 10名排行榜我的網頁。

眼下它顯示了一個又一個。

請讓我怎麼能顯示一行5另有5下一行？

這是我的HTML代碼

<div id="chart-A" class="chart"></div> 
<div class="spacer"></div> 
<div id="chart-B" class="chart"></div> 
<div class="spacer"></div> 
<div id="chart-C" class="chart"></div> 
<div class="spacer"></div> 
<div id="chart-D" class="chart"></div> 
<div class="spacer"></div> 
<div id="chart-E" class="chart"></div> 
<div class="spacer"></div> 



.chart { 
    height: 150px; 
} 

可否請你讓我知道我可以在兩行??顯示圖表（包括5每行。）

Answer 1

總結前5周走勢圖另一列中的一列和其他5列。爲列設置寬度。將第二列左側的第一列浮起以在右側空間流動。

.chart { 
    height: 150px; 
} 
.col-1 { 
    display: inline-block; 
    float: left; 
    max-width: 50%; 
} 
.col-2 { 
    width: 50%; 
} 

<div class="col-1"> 
    <div id="chart-A" class="chart"></div> 
    <div class="spacer"></div> 
    <div id="chart-B" class="chart"></div> 
    <div class="spacer"></div> 
    <div id="chart-C" class="chart"></div> 
    <div class="spacer"></div> 
    <div id="chart-D" class="chart"></div> 
    <div class="spacer"></div> 
    <div id="chart-E" class="chart"></div> 
    <div class="spacer"></div> 
</div> 
<div class="col-2"> 
    <div id="chart-F" class="chart"></div> 
    <div class="spacer"></div> 
    <div id="chart-G" class="chart"></div> 
    <div class="spacer"></div> 
</div> 

JSfiddle