JSFiddle - React, Tailwind, and code Playground

HTML

<main>
		<a href="#" class="logo"><img src="img/logo.svg" alt="Описание сайта"></a>
		<nav>
			<a href="#">Меню 1</a>
			<a href="#">Меню 2</a>
			<a href="#">Меню 3</a>
			<a href="#">Меню 4</a>
			<a href="#">Меню 5</a>
		</nav>
		<aside>
			<h1>Название рубрики</h1>
			<a href="#">Фильтр 1</a>
			<a href="#">Фильтр 2</a>
			<a href="#">Фильтр 3</a>
			<a href="#">Фильтр 4</a>
		</aside>
		<section class="content">
			<article>
				<a href="#"><img src="pic.jpg" alt="!Alt"></a>
				<h2>Название статьи</h2>
				<span>автор\категория\комментариев</span>
				<button>Читать далее</button>
				<hr>
				<span>Дата</span>
			</article>
			<article>
				<a href="#"><img src="pic.jpg" alt="!Alt"></a>
				<h2>Название статьи</h2>
				<span>автор\категория\комментариев</span>
				<button>Читать далее</button>
				<hr>
				<span>Дата</span>
			</article>
			<article>
				<a href="#"><img src="pic.jpg" alt="!Alt"></a>
				<h2>Название статьи</h2>
				<span>автор\категория\комментариев</span>
				<button>Читать далее</button>
				<hr>
				<span>Дата</span>
			</article>
			<article>
				<a href="#"><img src="pic.jpg" alt="!Alt"></a>
				<h2>Название статьи</h2>
				<span>автор\категория\комментариев</span>
				<button>Читать далее</button>
				<hr>
				<span>Дата</span>
			</article>
			<article>
				<a href="#"><img src="pic.jpg" alt="!Alt"></a>
				<h2>Название статьи</h2>
				<span>автор\категория\комментариев</span>
				<button>Читать далее</button>
				<hr>
				<span>Дата</span>
			</article>
			<article>
				<a href="#"><img src="pic.jpg" alt="!Alt"></a>
				<h2>Название статьи</h2>
				<span>автор\категория\комментариев</span>
				<button>Читать далее</button>
				<hr>
				<span>Дата</span>
			</article>
			<article>
				<a href="#"><img src="pic.jpg" alt="!Alt"></a>
				<h2>Название статьи</h2>
				<span>автор\категория\комментариев</span>
				<button>Читать далее</button>
				<hr>
				<span>Дата</span>
			</article>
			<article>
				<a href="#"><img src="pic.jpg"...

CSS

body {height: 100%;}
main{
    display: block;
	width: 1200px;
    min-height: 100%;
	margin: auto;
    padding: 10px;
}
nav,
aside,
.logo{
	position: fixed;
	width: 10%;
    min-height: 33%;
    top:0;
    left:0;
    padding: 10px;
}
nav {
    top:33%;
}
aside {
    top:66%;
}

.logo>img{
	display: block;
	max-width: 100%;
}
.content{
	width: 80%;
	float: right;
}