JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header">
    <div id="content">
        <div id="logo">
            <img src="http://placehold.it/350x150" style="width: 100%; height: auto;">
        </div>
        <div id="header-gegevens"> <b>Dimitri Geers</b>
            <br/>Administrator
            <br/>
            <br/>Instellingen | Uitloggen</div>
    </div>
</div>

CSS

@font-face {
    font-family:'MavenPro';
    src: url('fonts/MavenProLight-200.otf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
html, body {
    padding: 0px;
    margin: 0px;
}
#header {
    background-color: #3499D5;
    width: 100%;
    height: auto;
    margin: 0px;
}
#header #content {
    width: 80%;
    height: auto;
    overflow:auto;
    margin: 0px auto;
}
#header #content #logo {
    width: 30%;
    height: auto;
    margin-left: 10%;
    padding-top: 2.5%;
    padding-bottom: 2.5%;
}
#header #content #header-gegevens {
    width: 40%;
    height: auto;
    float: right;
}