JSFiddle - React, Tailwind, and code Playground

HTML

<p style="clear:both;">FLEX 5</p>
<div id="resizable2" class="contenaireBlc">
	<div class="contenaireHori">
		<div class="innerTop"></div>
		<div class="traversHori"></div>
  		<div class="innerBottom">
  			<div class="contenaireHori">
				<div class="innerTop"></div>
				<div class="traversHori"></div>
  				<div class="innerBottom"></div>
			</div>
  		</div>
	</div>
</div> 

<p style="clear:both;">FLEX 3</p>
<div id="resizable2" class="contenaireBlc">
	<div class="contenaireHori">
		<div class="innerTop"></div>
		<div class="traversHori"></div>
  		<div class="innerBottom"></div>
	</div>
</div>

CSS

div.contenaireBlc {background:#FFF; border:1px solid #ddd; width:250px; height:250px;margin:0 30px 0 0;}


.contenaireVert {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;  
  /* piste pour ie10 -ms-flex-direction: row;
  -ms-flex-wrap: nowrap;*/
  flex-direction: row;
  flex-wrap: nowrap;
  background:#FFF; 
  width:100%; 
  height:100%;
}




.innerGch{
  flex: 1;
  /* piste pour ie10 ms-flex: 1; */
  background:#cee8f7;
  height:100%; 
}

.traversVert{
  width: 20px;
  background:#FFF; 
  height:100%;
}

.innerDrt{
  flex: 1;
  /* piste pour ie10 ms-flex: 1; */
  background:#cee8f7; 
  height:100%;  
}


/**************************************************/

.contenaireHori {
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  -webkit-flex-direction: column;
  -webkit-flex-wrap: nowrap;
  /*align-content:space-between;
  align-items:flex-start;
  justify-content:space-between;*/
  background:#777; 
  height:100%;
  width:100%;
}

.innerTop{
  -webkit-flex: 1 1 50%;
  flex: 1 1 50%;
  background: green;
  width: 100%;
}


.traversHori{
  flex: 0 0 20px;
  -webkit-flex: 0 0 20px;
  background: blue; 
  width: 100%;
  
}

.innerBottom{
  -webkit-flex: 1 1 50%;
  flex: 1 1 50%;
  background: red;
  width: 100%;
}