2016-03-25 7 views
1

これは私がちょっと表は左ハイチャートとテーブルを水平に設定するには?

上にある一方で、これは私のhtmlでグラフが右側になりたい気圧

enter image description here

ように私のhighchartが見えるものです:

<div id="words" style="width:70%;float:left;"> 
<table border="1" class="highchart" data-graph-container-before="1" data-graph-type="column"> 
    <thead> 
     <tr> 
      <th>Word</th> 
      <th>Count</th> 
     </tr> 
    </thead> 
    <tbody> 

       <tr> 
        <td>icon</td> 
        <td>12</td> 
       </tr> 
       <tr> 
        <td>text</td> 
        <td>12</td> 
       </tr> 
       <tr> 
        <td>your</td> 
        <td>9</td> 
       </tr> 
       <tr> 
        <td>post</td> 
        <td>6</td> 
       </tr> 
       <tr> 
        <td>document</td> 
        <td>5</td> 
       </tr> 
       <tr> 
        <td>with</td> 
        <td>5</td> 
       </tr> 
       <tr> 
        <td>parentNode</td> 
        <td>4</td> 
       </tr> 
       <tr> 
        <td>email</td> 
        <td>4</td> 
       </tr> 
       <tr> 
        <td>com&quot;</td> 
        <td>4</td> 
       </tr> 
       <tr> 
        <td>googletag</td> 
        <td>3</td> 
       </tr> 
    </tbody> 
</table> 

私は、このような出力を達成するために何をすべき?

答えて

2

HTMLを変更できる場合は、Highchartsコンテナの前にテーブルを置き、適切なスタイル(浮動小数点数、幅)を設定するだけです。たとえば、2つのdivを使用することもできます:http://jsfiddle.net/68qdew8g/

<div style="float: left; width: 30%;"> 
    <table border="1" class="highchart" data-graph-container-before="1" data-graph-type="column"> 
     ... 
    </table> 
</div> 
<div id="words" style="width:70%;float:left;"></div> 
+0

ありがとう –

関連する問題