JSFiddle - React, Tailwind, and code Playground

HTML

<div id="header" style="background-color:white;width:100%; height:100px; margin: 0; padding: 0 ;border:0;"></div>
<div id="map_canvas" style="background-color:black;width:100%;height:calc(100vh - 200px);margin: 0; padding: 0 ;border:0;"></div>
<div id="footer" style="background-color:white;width:100%; height:100px; margin: 0; padding: 0 ;border:0;bottom:0px;"></div>

CSS

html, body {
    height: 100vh;
    margin: 0;
}