JSFiddle - React, Tailwind, and code Playground

HTML

<header>
            <div class="header-container">
                <img src="images/gh-logo.png" alt="">
                <button class="btn btn-success">Logout</button>
            </div>
        </header>
        <div class="wrap">
            <main class="studio-signup">
                <div class="sidebar">
                    <img class="img-circle display-pic" src="images/dp.png" alt="user display picture">
                    <nav>
                        <ul>
                            <li><a href=""><img src="images/weight.png" alt=""></a></li>
                            <li><a href=""><img src="images/weight.png" alt=""></a></li>
                            <li><a href=""><img src="images/weight.png" alt=""></a></li>
                            <li><a href=""><img src="images/weight.png" alt=""></a></li>
                        </ul>
                    </nav>
                </div>
                <div class="content">
                    <div class="g-analytics">
                        <h2>Analystics</h2>
                        <div class="">
                        </div>
                        <div class="">
                        </div>
                        <div class="">
                        </div>
                        <div class="">
                        </div>
                        </div>
                        <div class="">
                    </div>
                    <div class="g-manual-checkin">
                        <h2>Manual Check In</h2>
                    </div>
                    <div class="g-finacial">
                        <h2>Finacial</h2>
                    </div>
                    <div class="g-settings">
                        <h2>Settings</h2>
                    </div>
                    <button class="btn btn-sucesss">Update</button>
                </div>
            </main>
            <footer>
            </footer>
        </div>

CSS

.sidebar{
      width:100px !important;
      height: 100%;
      background-color: @appSidebarGrey;
      text-align: center;
      float: left;
}

.content{
      width: calc(100% - 100px);
      width: ~"calc(100% - 100px)";
      background-color: blue;
      float: left;
    }
  main{
    display: block;
    height: 100%;
    width: 100%;
}

.sidebar img.display-pic{
        margin:2em auto 0 auto;
        width:54px;
      }