HTML在超过父div时在新行中显示子div

Question

检查 演示

当父 div 的宽度超过时，我试图将子 div 元素带到新行。我试过 display:flex ，但是当超过父宽度时，子 div 不会出现新行。就像引导类行子 div 元素超过了父元素的宽度，它应该放在新行中。

HTML

 <div class="wrap">
      <div class="block">Block 1</div>
      <div class="block">Block 2</div>
      <div class="block">Block 3</div>
      <div class="block">Block 4</div>
      <div class="block">Block 5</div>
</div>

CSS

.wrap
{
  width:140px;
  display:flex;
  background:yellow;
}
.block
{
  margin-right:5px;
  width:70px;
}

Answer 1

.wrap
{
  width:140px;
  flex-flow:row wrap;
  display: flex;
  background:yellow;
}
.block
{
  margin-right:5px;
  width:70px;
}

<div class="wrap">
      <div class="block">Block 1</div>
      <div class="block">Block 2</div>
      <div class="block">Block 3</div>
      <div class="block">Block 4</div>
      <div class="block">Block 5</div>
</div>

勾选此code.You可以使用flex-flow: row wrap与display:flex