JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="style.css">
</head>
<body>
	<div id="wrapper">
		<div id="head">
			<div id="logo">Logo</div>
			<div id="site-info">Site Info</div>
		</div>
		<div id="top-nav">
			<div class="wrap">
			<ul>
				<li><a href="">Item 1</a></li>
				<li><a href="">Item 2</a></li>
				<li><a href="">Item 3</a></li>
				<li><a href="">Item 4</a></li>
				<li><a href="">Item 5</a></li>
			</ul>
			</div>
		</div>
		<div id="main-content">
			<div id="content"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc pretium interdum ante, nec consectetur erat facilisis consectetur. Morbi dignissim auctor lorem sollicitudin accumsan. Praesent nec hendrerit tellus. Suspendisse potenti. Nam sit amet mi sed felis hendrerit tempus. Aenean faucibus pulvinar elit id cursus. Ut et dignissim orci. Sed tristique risus id lacinia suscipit. Quisque placerat vitae tellus nec venenatis. Integer tempus, est sit amet suscipit feugiat, sem mi faucibus sem, in rutrum augue felis nec elit. Vivamus pretium tempus purus vel adipiscing. Nullam posuere risus placerat lacus molestie feugiat. Praesent auctor venenatis arcu nec luctus. Vestibulum non justo non nibh placerat porta. Quisque hendrerit elit vitae sem hendrerit, commodo tristique ipsum posuere. Morbi ac commodo est.</p></div>
			<div id="right-menu">
				<div id="category">
					<ul>
						<li><a href="">Item 1</a></li>
						<li><a href="">Item 2</a></li>
						<li><a href="">Item 3</a></li>
						<li><a href="">Item 4</a></li>
						<li><a href="">Item 5</a></li>
					</ul>
				</div>
				<div id="log-in">
					<form action="">
						<div id="login">
							<div class="label">Login:</div>
							<input type="text">
						</div>
						<div id="password">
							<div class="label">Password:</div>
							<input type="text">
						</div>
						<div id="log-btn"></div>
					</form>
				</div>
			</div>
			<div...

CSS

* {
	margin: 0;
	padding: 0;
}

#wrapper {
	width: 960px;
	margin: 0 auto;
}

#head {
	height: 100px;
	background: cyan;
}

#logo {
	float: left;
	margin-left: 20px;
	margin-top: 30px;
}

#site-info {
	float: left;
	margin-left: 800px;
	margin-top: 30px;
}

#top-nav {
	width: 958px;
	height: 28px;
	padding: 1px;
	background: orange;
}

#top-nav .wrap {
	width: 600px;
	margin: 0 auto;
	margin-top: 3px;
}

#top-nav ul li {
	display: inline-block;
	list-style: none;
	margin-left: 50px;
}

#main-content {
	background: yellow;
}

#content {
	float: left;
	margin-right: 220px;
}


#right-menu {
	background: pink;
	width: 200px;
	float: right;
}

#right-menu ul li {
	list-style: none;
}

.clear-fix {
	clear: both;
}