angular chart.js 未在 flexbox 中调整大小(收缩)

Ant*_*ton 4 angularjs chart.js

看小提琴

https://jsfiddle.net/m942h0wm/6/

HTML

<div class="container" ng-app="app">
  <div class="main">
    <p>Main</p>
  </div>
  <div class="aside">
    <canvas class="chart chart-doughnut" 
        chart-data="[10,20,40]" 
        chart-labels="['one', 'two', 'three']">
    </canvas>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS

.container {
  display: flex;
  flex-wrap: wrap;
}

.container>div {
  border: solid 10px;
}

.main {
  flex-grow: 2;
  flex-basis: 300px;
}

.aside {
  flex-grow: 1;
  flex-basis: 200px;
}
Run Code Online (Sandbox Code Playgroud)

如果您缩小窗口以使布局弹出为垂直,则当您重新调整大小时,布局不会弹出

有没有其他人发现这个并解决它?

Ant*_*ton 6

我在这里找到了解决方案

当窗口变小时 Flex 项目不会缩小

min-width: 0;
Run Code Online (Sandbox Code Playgroud)

在项目上:)