JSFiddle - React, Tailwind, and code Playground

HTML

<div id="body">
<div id="cor" style="float:left;"></div>
<div id="cor" style="float:right;"></div>
<div id="hor"></div>

<div id="ver" style="float:left;">бу!</div>
<div id="ver" style="float:right;"></div>
    <div id="wish_body">ой за горою<br />ой за большою<br />что-то определенно есть -_-</div>

<div id="cor" style="float:left;"></div>
<div id="cor" style="float:right;"></div>
<div id="hor"></div>
</div>

CSS

#body {
	width:300px;
	background-color:#999;
	}
#cor {
	width:32px;	height:32px;
	background-color:#FF0; opacity:0.5;
	}
#hor {
	height:32px; margin-left:32px; margin-right:32px;
	background-color:#F90;
	}
#ver {
	width:32px; height:100%; margin-top:0px; margin-bottom:0px;
	background-color:#FF0;
	}
#wish_body {
	margin-left:32px; margin-right:32px;
	background-color:white;
	}