JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Структура страницы</title>

	<link rel="stylesheet" href="style.css">
</head>
<body>
	<div class="header">
				<div class="inner-header">
							


		</div>
		<div class="row">

			<div class="sidebar-1">
				<div class="inner-sidebar-1">Сайдбар #1</div>
		</div>

				<div class="content">

				
							<div class="row">

							</div>


		</div>

					<div class="sidebar-2">
				<div class="inner-sidebar-2">Сайдбар #2</div>
		</div>
	
		</div>
		<div class="footer">
				<div class="inner-footer">Футер</div>
		</div>

	</div>
	
</body>
</html>

CSS

*	{
	box-sizing:border-box;
}

body {
	color: white;
	font-size:30px;
}
.row:after {
  visibility: hidden;
  display: block;
  font-size: 0;
  content: " ";
  clear: both;
  height: 0;
}
.row { display: inline-block; }
/* start commented backslash hack \*/
* html .row { height: 1%; }
.row { display: block; }
/* close commented backslash hack */
.header {

}
.inner-header {
		background: #3d3c66;
	height: 200px;
		margin-bottom: 10px;
		margin-left:20px;
}

.content	{
  background:blue;
	width:60%;
	float:left;
	height:500px;
}

.sidebar-1	{
	width:300px;
	float:left;
	padding-right: 10px;
}
.inner-sidebar-1	{	
	background:#3d3c66;
	min-height: 500px;
	}
.sidebar-2	{
	width:300px;
	float:right;
	padding-left: 10px;
}
.inner-sidebar-2	{	
	background:#3d3c66;
	min-height: 500px;
	}
.footer {
	margin-top:10px;
}
.inner-footer {
		background:#3d3c66;
	height:200px;
}