2017-02-24 21 views
1

다음 HTML/CSS를 채워서 차트의 75 %를 채우고 300px 테이블의 여유 공간을 남겨 둡니다. 얼마 남았는지에 관계없이 차트에 항상 남은 공간을 채우고 싶습니다.차트의 크기를 항상 공백으로 채우는 방법

https://jsfiddle.net/horacebury/2vc606wx/17/

HTML :

<div ng-app="App"> 
    <div ng-controller="TodoCtrl"> 
    <div id="tablecontainer"> 
     <table class="tgh"> 
     <tr> 
      <td>Auxilliary Power</td> 
     </tr> 
     </table> 
     <div id="example"></div> 
     <table class="tg"> 
     <tr> 
      <td class="tg-yw4l" ng-repeat="item in items track by $index">{{item}}</td> 
     </tr> 
     </table> 
    </div> 
    <div id="c3chart"></div> 
    </div> 
</div> 

CSS :

#tablecontainer { 
    float: right; 
} 

#c3chart { 
    width: 65%; 
} 
+0

조기에 지원할 필요가없는 한 최선의 선택은 [flex-box] (https://css-tricks.com/snippets/css/a-guide-to-flexbox/)를 사용하는 것입니다 IE 버전. – user3432422

+2

오버플로 : 숨겨진 답변보기 -> http://stackoverflow.com/questions/1260122/expand-a-div-to-take-the-remaining-width 결과 : https://jsfiddle.net/2vc606wx/28 / – mgraham

답변