<h2>align-content:stretch</h2>
<div class="container wrap stretch">
  <div class="box">01</div>
  <div class="box">02</div>
  <div class="box">03</div>
  <div class="box">04</div>
  <div class="box">05</div>
  <div class="box">06</div>
</div>

<h2>align-content:flex-start</h2>
<div class="container wrap flex-start">
  <div class="box">01</div>
  <div class="box">02</div>
  <div class="box">03</div>
  <div class="box">04</div>
  <div class="box">05</div>
  <div class="box">06</div>
</div>

<h2>align-content:flex-end</h2>
<div class="container wrap flex-end">
  <div class="box">01</div>
  <div class="box">02</div>
  <div class="box">03</div>
  <div class="box">04</div>
  <div class="box">05</div>
  <div class="box">06</div>
</div>

<h2>align-content:center</h2>
<div class="container wrap center">
  <div class="box">01</div>
  <div class="box">02</div>
  <div class="box">03</div>
  <div class="box">04</div>
  <div class="box">05</div>
  <div class="box">06</div>
</div>

<h2>align-content:space-between</h2>
<div class="container wrap space-between">
  <div class="box">01</div>
  <div class="box">02</div>
  <div class="box">03</div>
  <div class="box">04</div>
  <div class="box">05</div>
  <div class="box">06</div>
</div>

<h2>align-content:space-around</h2>
<div class="container wrap space-around">
  <div class="box">01</div>
  <div class="box">02</div>
  <div class="box">03</div>
  <div class="box">04</div>
  <div class="box">05</div>
  <div class="box">06</div>
</div>
.container{
  width: 360px;
  height: 360px;
  display: flex;
  flex-direction:row;
  
  margin-right: 10px;
  background-color: #eee;
  margin-bottom: 80px;
}

.wrap{flex-wrap: wrap;}

.stretch{align-content:stretch;}
.flex-start{align-content:flex-start;}
.flex-end{align-content:flex-end;}
.center{align-content:center;}
.space-between{align-content:space-between;}
.space-around{align-content:space-around;}





.box{
  width: 100px;
/*   height: 100px; */
  margin: 10px;
  text-align: center;
  font-size: 50px;
  font-weight: bold;
  line-height: 100px;
}

.box:nth-child(1){background-color: gold;}
.box:nth-child(2){background-color: pink;}
.box:nth-child(3){background-color: skyblue;}
.box:nth-child(4){background-color: lightgreen;}
.box:nth-child(5){background-color: salmon;}
.box:nth-child(6){background-color: mediumpurple;}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.