JSFiddle - React, Tailwind, and code Playground

by Rolf

HTML

<header class="h1">
   <img src="https://via.placeholder.com/70.png/90f/fff" alt="Logo">
		<p>Testseite Umleitung</p>
</header>
    <br>
<header class="h2">
   <img src="https://via.placeholder.com/70.png/90f/fff" alt="Logo">
		<p>Testseite Umleitung</p>
</header>

CSS

body {
 margin: 0px;
}

header.h1 {
 display: flex;
 justify-content: flex-start;
 align-items: center;
 background-color: #00BFFF;
 color: #ffffff;
 padding: 0.5em 1.5em;
}

header.h1 p {
 margin: 0;
 font: normal 3.6em Intern Web, serif;
 margin-left: 80px;
}

header.h2 {
 display: grid;
 grid-template-columns: auto 1fr;
 grid-gap: 80px;
 align-items: center;
 background-color: #00BFFF;
 color: #ffffff;
 padding: 0.5em 1.5em;
}

header.h2 p {
 margin: 0;
 font: normal 3.6em Intern Web, Comic Sans MS, serif;
}