JSFiddle - React, Tailwind, and code Playground

HTML

<div id="mainCont">
        <div id="sidebar">
            <a href="#">dapibus sit a</a>
            <a href="#">dapibus sit a</a>
            <a href="#">dapibus sit ag</a>
            <a href="#">dapibus sit a</a>
            <a href="#">dapibus sit a</a>
            <a href="#">dapibus sit a</a>
            <a href="#">dapibus sit a</a>
        </div>
        <div id="content">
            <div id="padding-wrapper">
                <h1>uris et lorem gravida condiment</h1>
                
                <h3 id="toc">apibus sit am</h3>                
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum nec gravida risus. Proin auctor imperdiet quam a dapibus. Nam leo turpis, lobortis eget molestie et, gravida eu augue. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi mattis tempor tempus. Duis lobortis auctor consectetur. Aenean nisi diam, rhoncus sit amet euismod et, faucibus ac ligula. Phasellus et elit a ligula ultrices vestibulum condimentum laoreet eros. Nunc enim nisl, convallis in varius non, interdum a nunc. Integer rutrum dapibus felis, in hendrerit magna aliquam eu.

Quisque leo diam, dapibus sit amet lobortis sed, semper ut orci. Suspendisse placerat, velit ut dictum consequat, magna quam gravida diam, nec egestas sem nulla eu tortor. Suspendisse tincidunt, nisl quis pharetra auctor, nibh sapien suscipit odio, non scelerisque tellus dolor quis metus. Nullam sed ipsum nunc. Cras eu urna eget libero elementum imperdiet nec ac nulla. Donec sapien purus, sollicitudin eget mattis eu, tristique vitae odio. Integer viverra pulvinar enim, ac mattis velit euismod sit amet.

Duis pharetra ultricies adipiscing. <a href="#q1">sectetur adipiscing elit. Vestibulum n</a> Mauris lacus tellus, pretium in aliquet pellentesque, condimentum sed turpis. Maecenas porttitor elit at est laoreet consectetur fermentum ligula mattis. Phasellus elit metus, aliquam quis auctor et, laoreet nec diam. Nullam adipiscing hendrerit feugiat. Nulla...

CSS

#mainCont {
  background-color: #000;
  overflow: hidden;
  padding-left: 148px; /* The width of the rail */
  height:1%; /* So IE plays nice */
}



#sidebar {
    display: inline;
  background-color: #9BBCE4;
  width: 148px;
  float: left;
  margin-left: -148px;
}


#sidebar a {
    display: block;
    padding: 15px 0px;
    font-size: 1.1em;
    text-align: center;
    color: #2C2C2C;
    text-decoration: none
}

#sidebar a:hover {
    background-color: #4e88ce;
    color: #FFFFFF;
}

#content{
    background-color: #FFFFFF;
  width:100%;
  border-left: 148px solid #9BBCE4;
  margin-left:-148px;
}

#padding-wrapper {
    padding: 30px 30px;
}

/* content formatting*/
#content h1 {
    font-size: 1.5em;
    margin: 15px 0px 20px 0px;
}

/* content formatting END*/