Thursday 29 May 2014

HighCharts - Graph sizes in Tabs not resizing to Tab

<style type="text/css">    /* bootstrap hack: fix content width inside hidden tabs */    .tab-stats-content > .tab-stats-pane  {        display: block;    /* undo display:none          */        height: 0;         /* height:0 is also invisible */        overflow: hidden;  /* no-overflow                */        padding: 0px;    }    .tab-stats-content > .active, .tab-stats-pane > .active {          /* let the content decide it  */        height: 100%;
   }    /* bootstrap hack end */
</style>
<ul class="nav nav-tabs" id="myTab">
   <li class="tab-pane active"><a href="#active" data-toggle="tab">Teams And Users By Week</a></li>
   <li><a href="#teamsbysport" data-toggle="tab">Teams By Sport</a></li>
   <li><a href="#teamsthismonth" data-toggle="tab">Teams Created This Month</a></li>
</ul>
<div class="tab-stats-content">
   <div class="tab-stats-pane active" id="active">    {{ render(controller('RosterbotAnalyticBundle:Graph:Draw', {'graph':'TeamsAndUsersByWeek', 'div' : 'active'} ))}}  </div>
   <div class="tab-stats-pane" id="teamsbysport">      {{ render(controller('RosterbotAnalyticBundle:Graph:Draw', {'graph':'TeamsBySport', 'div' : 'teamsbysport'} ))}}  </div>
   <div class="tab-stats-pane" id="teamsthismonth">        {{ render(controller('RosterbotAnalyticBundle:Graph:Draw', {'graph':'TeamsThisMonth', 'div' : 'teamsthismonth'} ))}} </div>
</div>