SOURCE

<div class="grid">
	<div class="item1"></div>
	<div class="item2"></div>
	<div class="item3"></div>
	<div class="item4"></div>
	<div class="item5"></div>
	<div class="item6"></div>
	<div class="item7"></div>
	<div class="item8"></div>
</div>

* {
    box-sizing: border-box;
}

body {
    overflow: hidden;
}
.grid {
    display: grid;
    width: 3a0px;
    height: 300px;
    grid-template-areas: 'item1 item2 item2 item2' 'item3 item2 item2 item2' 'item4 item2 item2 item2' 'item5 item6 item7 item8';
}

.grid div {
    border: 3px solid red;
    margin: 3px;
    border-radius: 3px;
}

.item2 {
    grid-area: item2;
}