JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
	<div id="menu">
		<ul class="menu-list">
			<li class="menu-item"><a href="#" class="menu-link">Каждый</a></li>
			<li class="menu-item"><a href="#" class="menu-link">Начинающий</a></li>
			<li class="menu-item"><a href="#" class="menu-link">Верстальщик</a></li>
			<li class="menu-item"><a href="#" class="menu-link">Должен</a></li>
			<li class="menu-item"><a href="#" class="menu-link">Научиться</a></li>
			<li class="menu-item"><a href="#" class="menu-link">Располагать</a></li>
			<li class="menu-item"><a href="#" class="menu-link">Элементы</a></li>
		</ul>
	</div>
	<div id="content">
		<div class="text"></div>
		<div class="text"></div>
		<div class="text"></div>
		<div class="text"></div>
	</div>
</div>

CSS

body {
	margin: 0;
}
#container {
	min-width: 800px;
}
#menu {
	position: fixed;
	top: 0;
	right: 50%;
	bottom: 0;
	left: 0;
	min-width: 200px;
	margin: 0 200px 0 0;
	background: #f0f0f0;
}
.menu-list {
	float: right;
	width: 200px;
	margin: 0;
	padding: 0;
	list-style: none;
	text-align: center;
}
#content {
	position: relative;
	z-index: 1;
	width: 600px;
	left: 100px;
	margin: auto;
}
.text {
	height: 200px;
}
.text:after {
	content: "";
	display: inline-block;
	width: 40px;
	height: 40px;
	margin: 0 0 0 -20px;
	border-radius: 50%;
	background: #fff;
}