JSFiddle - React, Tailwind, and code Playground

HTML

<body>
        <div class="main">
            <header>
                <h1>Nadpis</h1>
            </header>
            
            <aside id="menu">
                <h2>Menu</h2>
                <nav>
                </nav>
            </aside>
            <article id="hlavni">
                <section id="novinky">
                        Text je v lingvistice spojitý jazykový útvar, který se uplatňuje v komunikaci jako komplexní jednotka sdělování. Označuje uskupení slov, které dohromady tvoří nějakou výpověď. Pojem se obvykle používá pro psané výpovědi delšího rozsahu (odstavec), lze jej ovšem užít i pro mluvený jazykový projev nebo i krátké výpovědi. Knihy jsou označovány jako umělecké texty, novinové články jako publicistické texty, atd.

              Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam, et, facilis. Id incidunt aut perferendis, minima maiores obcaecati animi voluptas, suscipit. Adipisci assumenda similique ex, quaerat! Cum praesentium minus necessitatibus? Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis nihil odit ducimus quis amet recusandae magni consectetur eius error quisquam eum nesciunt vel unde non suscipit et, voluptate officiis voluptatem. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempore ea ad velit, at quasi suscipit in itaque assumenda inventore minima dolore saepe quam soluta nostrum repudiandae dolores modi, nam culpa. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequatur similique debitis, animi, iste culpa, pariatur obcaecati distinctio et illum optio libero eligendi accusamus, provident temporibus dolores. Et dolorem, adipisci delectus.
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam, et, facilis. Id incidunt aut perferendis, minima maiores obcaecati animi voluptas, suscipit. Adipisci assumenda similique ex, quaerat! Cum praesentium minus necessitatibus? Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis nihil odit ducimus quis...

CSS

html {
    height: 100%;
}
body {
    font-family: "Times New Roman";
    width: 98%;
    margin: 1%;
    height: 96%;
    padding: 0;
   
}
.main   {
    width: 100%;
    min-height: 100%;
    position: relative;
}
#menu {
    background-color: rgb(221, 110, 110);
    width: 13%;
    float: left;
}
#hlavni   {
    width: 81%;
    float: left;
    padding-left: 1%;
}
.zapati {
    position: absolute;
    height: 30px;
    width: 100%;
    left: 0;
    bottom: 0;
    text-align: center;
    clear: both;
    background-color: rgb(221, 110, 110);
}