JSFiddle - React, Tailwind, and code Playground

HTML

<body>
	<header id="kopf">
		
	</header>
	<section id="menu">
			
	</section>
	<section id="haupt">
        <section class="eintrag">
		    <section class="eintrag_zeile">
			    <article class="eintrag_links">
			        <p>Feld 1</p>
                    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
			    </article>
			    <article class="eintrag_rechts">
			        <p>Feld 2</p>
                    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
			    </article>
		    </section>
		    <section class="eintrag_zeile">
			    <article class="eintrag_links">
			        <p>Feld 3</p>
                    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
			    </article>
			    <article class="eintrag_rechts">
			        <p>Feld 4</p>
                    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.</p>
			</article>
		</section>
	</section>		
	</section>
	<section id="info">
		
	</section>
<body>

CSS

html
{
background-image:url("");
background-attachment:fixed;
font-size: 13pt;
font: Bitstream Vera, Deja Vu, Linux Libertine, Source Sans Pro, Junicode, Liberation;
}

#kopf
{
border-width: 1px;
border-style: inset;
height: 8%;
width: 99%;
position: absolute;
left: 0.5%;
top: 1%;
}

#menu
{
border-width: 1px;
border-style: inset;
height: 89%;
width: 15%;
position: absolute;
left: 0.5%;
top: 10%;
}

#haupt
{
border-width: 1px;
border-style: inset;
height: 89%;
width: 68%;
position: absolute;
left: 16%;
top: 10%;
overflow: auto;
}

.eintrag
{
display: table;
height: 200px;
margin-left: 5px;
margin-right: 5px;
margin-top: 5px;
padding-left: 5px;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
border-width: 1px;
border-style: inset;
}

.eintrag_zeile
{
display: table-row-group;

}

.eintrag_links
{
display: table-cell;
height: 200px;
margin-left: 5px;
margin-right: 5px;
margin-top: 5px;
padding-left: 5px;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
border-width: 1px;
border-style: inset;
}

.eintrag_rechts
{
display: table-cell;
height: 200px;
margin-left: 5px;
margin-right: 5px;
margin-top: 5px;
padding-left: 5px;
padding-top: 5px;
padding-right: 5px;
padding-bottom: 5px;
border-width: 1px;
border-style: inset;
}



#info
{
border-width: 1px;
border-style: inset;
height: 89%;
width: 15%;
position: absolute;
left: 84.5%;
top: 10%;
}