how to make a a two row and one column using flex
.flag{
position:relative;
display:flex;
flex-flow:column wrap;
width:200px;
height:150px;
border:2px solid black;
}
.green{background:green;}
.yellow{background:yellow;}
.red{background:red;}
.col1{width:40%;height:100%;}
.col2{width:60%;height:50%;}
<div class=flag>
<div class='col1 green'></div>
<div class='col2 yellow'></div>
<div class='col2 red'></div>
</div>