Проблема с отображением графика C3 в угловой структуре материала

У меня странная проблема с отображением графиков в макете AMD. Есть два виджета, в которых я определил графики, и вот как это выглядит: вы можете видеть, что графики в виджетах выходят из своей области

Я попытался воспроизвести эту ошибку в плункере, и нет ничего плохого:/

Когда я делаю небольшое изменение в браузере (например, я перемещаю край браузера), графики возвращаются в нужное место → http://recordit.co/mRmNAjH840

<div layout="row" ng-controller="GraphCtrl" layout-md="column" layout-sm="column" layout-margin="">

    <section class="widget md-whiteframe-z1 ng-isolate-scope md-cyan-theme" ng-class="{'widget-overlay-title': overlayTitle}" ng-attr-layout="{{widgetLayout}}" content-padding="" flex-gt-lg="66" flex-gt-md="66">
        <div class="panel-heading">Widget1<span flex=""></span>
        </div>
        <div class="panel-body">
            <div id="chart1"></div>
        </div>
    </section>

    <section class="widget md-whiteframe-z1 ng-isolate-scope md-cyan-theme" ng-class="{'widget-overlay-title': overlayTitle}" ng-attr-layout="{{widgetLayout}}" content-padding="" flex-gt-lg="32" flex-gt-md="32">
        <div class="panel-heading">Widget2<span flex=""></span>
        </div>
        <div class="panel-body">
            <div id="c3_combined"></div>
        </div>
    </section>
</div>