JSFiddle - React, Tailwind, and code Playground

HTML

<div class="site-menu">
<ul>
    <li><a href="#">Пункт 1</a></li>
    <li><a href="#">Пункт 2</a></li>
    <li><a href="#">Пункт 3</a></li>	
</ul>
</div>

<div class="site-content">
<img src="http://1.bp.blogspot.com/-1sYBdTNIDNU/UbslloHKacI/AAAAAAAAD48/6rnlSYUaU7k/s300/garila.jpg" class="im">
</div>

<div class="site-ad">

</div>

CSS

* {
	margin:0;
	padding:0;
}

.site-menu {
	height: 500px;
	width: 20%;
	float: left;
	background: red;
}

.site-content{
	height: 500px;	
	width: 50%;
	float: left;
	background: green;
	text-align: center;
	line-height: 500px;
}

.site-ad{
	height: 500px;	
	width: 30%;
	float: left;
	background: blue;	
}

ul li {
		float: left;
		list-style: none;
}

ul li a {
	display: block;
	padding: 10px 15px;
	
}

.im {
  vertical-align: middle;    
}