JSFiddle - React, Tailwind, and code Playground

HTML

<div class="sidebar">
			<a href="#">About</a>
			<a href="#">Portfolio</a>
			<a href="#">Photography</a>
			<a href="#">Sketchbook</a>
			<a href="#">Contact</a>
		</div>
		<div class="content-area">
			<img src="http://www.2020site.org/trees/images/MatureAppleTree.jpg"/>
            <img src="http://www.2020site.org/trees/images/MatureAppleTree.jpg"/>
		</div>

CSS

@import url(https://fonts.googleapis.com/css?family=Roboto:500,300);

*{
	margin: 0;
	padding: 0;
	font-family: 'Roboto', sans-serif;
	font-weight: 500;
}

html{
	height: 100%;
}

body{
	height: 100%;
}

.sidebar{
	display: inline-block;
	width: 200px;
	height: 100%;
	background: #CCCCCC;
}

.sidebar >a{
	display: block;
	height: 40px;
	background: #AAAAAA;
	margin-bottom: 1px;
	text-decoration: none;
	color: #000000;
	padding-top: 10px;
	padding-left: 10px;
}

.sidebar >a:hover{
	background: #999999;
}

.sidebar >a:active{
	background: #FFFFFF;
}

.content-area{
	display: inline-block;
	vertical-align: top;
	/*padding-left: 40px;
	padding-top: 40px;*/
	height:100%;
}

.content-area img{
	display: inline-block;
}