Я бы использовал макет Grid: например, с помощью grid-template вы устанавливаете положение доступных областей, затем с помощью grid-area вы назначаете определенную область элементу
main {
display: grid;
grid-template:
"c1 c1 c2 c5"
"c1 c1 c3 c5"
"c1 c1 c4 c6"
}
section {
border: 1px #446 solid;
margin: 2px;
min-height: 100px;
}
.c1 { grid-area: c1; }
.c2 { grid-area: c2; }
.c3 { grid-area: c3; }
.c4 { grid-area: c4; }
.c5 { grid-area: c5; }
.c6 { grid-area: c6; }
<main>
<section class="c1">1</section>
<section class="c2">2</section>
<section class="c3">3</section>
<section class="c4">4</section>
<section class="c5">5</section>
<section class="c6">6</section>
</main>