JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header"></div>
<div id="colonnes">
    <div>1</div>
    <div>2</div>
    <div id="last">3</div>
</div>
<div style="clear:both;"></div>
<div id="footer"></div>

CSS

#header {
    background-color: yellow;
    height: 20px;
}

#colonnes {position: fixed; height: auto; top:20px; bottom: 20px;}

#colonnes div{
    float: left;
    width: 100px;
    height: 100%;
    bottom: 0;
    margin: 0 10px 0 0;
    background-color: black;
}

#footer {
    background-color: red;
    height: 20px;
    position: fixed;
    bottom: 0;
    width: 100%;
}

body{
    height: 100%;
    padding: 0;
    margin: 0;
}