Flex dilemna

HTML

<div class="parent">
	<div class="green"></div>
	<div class="red"></div>
	<div class="red"></div>
	<div class="blue"></div>
</div>

CSS

.parent {
	display: flex;
}
.green, .red, .blue {
	width: 50px;
}
.green, .blue {
	height: 300px;
}
.red {
	height: 150px;
	border: 5px solid red;
}
.green {
	border: 5px solid green;
}
.blue {
	border: 5px solid blue;
}