JSFiddle - React, Tailwind, and code Playground

by fersterin

HTML

<div class="layout">
	<div class="content">Контент</div>
	<div class="sidebar">Сайдбар</div>
	<div class="nav">Нав (резина)</div>
</div>
<!-- Порядок блоков не соотвествует порядку на result, но так нужно для работы float. Сначала должны идти плавующие блоки. -->

CSS

.layout {
	overflow: hidden;
}
.nav {
	margin-right: 300px;
	background-color: lightgreen;
}
.sidebar {
	background-color: lightblue;
	width: 200px;
	float: right;
}
.content {
	background-color: #c3c;
	width: 100px;
	float: right;
}