JSFiddle - React, Tailwind, and code Playground

HTML

<div id="leftmenu">
    <div id="logo"></div>
    <div id="navi">
        <ul>
            <li><a href="#">Home</a></li>
            <li><a href="#">Home</a></li>
            <li><a href="#">Home</a></li>
            <li><a href="#">Home</a></li>
        </ul>
    </div>
    <div id="bottom"></div>
</div>

CSS

#leftmenu {position:fixed; height:100%; width:150px; margin-left:20px; background:black; padding:0px 10px; box-sizing:border-box;}
    #logo {position:relative; top:10px; width:130px; height:100px; background:#333;}
    #navi {top:50%; height:127px; margin-top:-64px; position:absolute;}
        #navi li a {display:block; text-decoration:none; color:white; margin:5px 0px;}
#bottom {position:absolute; bottom:20px; width:130px; height:100px; background:#555;}