Crossed boxes V1

by Simon Hi

HTML

<div class="b0">
  <div class="b1">A A A A A</div>
  <div class="b2">B</div>
  <div class="b3">C C C C</div>
  <div class="b4">D D</div>
  <div class="b5">E E E</div>
</div>

CSS

.b0 {
  display: flex;
  flex-wrap: wrap;
  font-size: 3em
}

.b1,
.b2,
.b3,
.b4,
.b5 {
  width: 33.33%;
}

.b1 {
  background: red;
  margin: 0 33.33%;
}

.b2 {
  background: blue;
}

.b3 {
  background: green;
}

.b4 {
  background: orange;
}

.b5 {
  background: pink;
  margin: 0 33.33%;
}