Flex Box Chrome浏览器70版面临着高度问题

Question

像上面一样，chrome不会调整大小以适应行内流动的内容。这是我的CSS：

box1 {
  display: flex;
  flex-flow: column;
  height: 100%;
 }

.box1 .row1 {
  border: 1px dotted grey;
  box-sizing:border-box;
}

.box1 .row1.header {
  flex: 0 1 auto;
}

.box1 .row1.content1 {
  flex: 1 1 auto;
  display: flex;
  flex-direction:row;
  flex-grow:1; 
  min-height: 0;

}
.leftxx{
    background:lightgreen;
    width: 20%;

  }


  .rightxx{
    background: lightblue;
    width: 100%;
    flex-grow:1; 
  min-height: 0;
  }
.box1 .row1.footer {
  flex: 0 1 auto;
}

html ：（为了可见而删除了内容）

<div class="box1">
  <div class="row1 header">
    <p><b>header</b>
      <br />
      <br />(sized to content)</p>
  </div>
  <div class="row1 content1">
    <div class="leftxx">Left</div>
    <div class="rightxx">
        <div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quibusdam magni ipsa excepturi doloribus amet dicta voluptatibus dolorem architecto deleniti quo recusandae dolor quos fugiat eos consequuntur minima perferendis deserunt, dolores.</div>
        <div>Porro harum, ex ea eius omnis sit placeat libero accusamus odio ut sapiente, aliquid eveniet! Fuga blanditiis repellat incidunt atque eveniet quaerat alias, a accusamus dolores quisquam natus molestiae molestias!</div>
        <div>Expedita delectus quasi velit repellat quos asperiores in. Libero aspernatur veniam aliquid error quidem quam ea perspiciatis inventore, ipsum iusto, reiciendis repudiandae nesciunt? Eligendi, dolor quam earum commodi quibusdam sint.</div>
        <div>Veritatis unde voluptatem pariatur tenetur minima officiis dolores reiciendis beatae ratione, sint accusamus, vel totam architecto laudantium? Cum cupiditate expedita optio nihil voluptatem, nobis sapiente recusandae id. In, obcaecati. Odit.</div>
        <div>Ea hic, dolorum sapiente id amet, repellat quos voluptates ab tenetur, tempore a officia est. Obcaecati molestiae cupiditate quis dolorem, quod, doloribus nobis ad sequi dicta accusamus harum vitae, vero!</div>
        <div>Possimus minus necessitatibus voluptatem, saepe id. Quis fugit laboriosam velit, voluptas officiis doloribus voluptate! Doloribus ipsa illum omnis aperiam odio, expedita consequatur obcaecati maxime accusantium vero iure velit impedit repellat.</div>
        <div>Sunt culpa aliquid rerum voluptate, exercitationem nostrum illo, provident odio rem molestias. Maxime cupiditate adipisci perspiciatis nemo ad facilis deleniti iure, ut enim, debitis sed rem magni amet doloremque eveniet!</div>
        <div>Necessitatibus quibusdam, non. Atque soluta repellat aut minus reprehenderit distinctio vitae, quidem maxime vero dolores, enim necessitatibus saepe et asperiores numquam, incidunt placeat! Voluptates consequatur at totam velit repudiandae! Reiciendis!</div>
        <div>Dolores sed veniam pariatur perspiciatis commodi facilis, consequatur sapiente, accusantium neque. Molestiae ex commodi minima consequatur omnis nesciunt dolorum, expedita aperiam ullam eligendi quo, quia provident quos, quaerat porro! Deserunt?</div>

    </div>
  </div>
  <div class="row1 footer">
    <p><b>footer</b> (fixed height)</p>
  </div>
</div>