JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<div id="wrapper">
    <div id="item-list">
        <ul class="nav nav-tabs">
            <li><a href="#">tab1</a></li>
            <li><a href="#">tab2</a></li>
            <li><a href="#">tab3</a></li>
            <li class="pull-right"><a href="#">tab4</a></li>
        </ul>
        <div ng-show="activeTab != 'create'">
            <ul class="list-group">
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
                <li>Some item...</li>
               ...

CSS

html, body {
    height: 100%;
}
#wrapper {
    height: 50%;
    background: #EAF9FF;
}
#item-list {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #B8E8F8;
    width: 476px;
    margin: 0 auto;
    padding: 10px;
}
#item-list > .nav-tabs {
    border: none;
}
#item-list > div {
    display: flex;
    flex: 1;
    flex-direction: column;
    height: 100%;
    max-height: 100%;
    background: #9FD9F0;
    padding: 10px;
    min-height: 0;
}
.list-group {
    overflow-y: scroll;
    background: #82C8E0;
    padding: 10px;
}