JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<body>
    <div id="row">
        <div class="headerp">
            <div class="items">Test1</div>
            <div class="items">Test2</div>
            <div class="items">Test3</div>
            <div class="items">Test4</div>
            <div class="items">Test5</div>
            <div class="items">Test6</div>
            <div class="items">Test7</div>
            <div class="items">Test8</div>
            <div class="items">Test9</div>
            <div class="items">Test10</div>
        </div>
        <div class="headers">
            <div class="items">
                <img src="http://placehold.it/200/100" alt="item 1" />
            </div>
            <div class="items">
                <img src="http://placehold.it/200/100" alt="item 2" />
            </div>
            <div class="items">
                <img src="http://placehold.it/200/100" alt="item 3" />
            </div>
            <div class="items">
                <img src="http://placehold.it/200/100" alt="item 4" />
            </div>
            <div class="items">
                <img src="http://placehold.it/200/100" alt="item 5" />
            </div>
            <div class="items">
                <img src="http://placehold.it/200/100" alt="item 6" />
            </div>
            <div class="items">
                <img src="http://placehold.it/200/100" alt="item 7" />
            </div>
            <div class="items">
                <img src="http://placehold.it/200/100" alt="item 8" />
            </div>
            <div class="items">
                <img src="http://placehold.it/200/100" alt="item 9" />
            </div>
            <div class="items">
                <img src="http://placehold.it/200/100" alt="item 10" />
            </div>
        </div>
        <div class="headers">
      ...

CSS

#row {
    white-space: nowrap;
    /* important */
    overflow: visible;
}
.items {
    display: inline-block;
    width: 20%;
}
/* .headerp:after {
    content: " ";
    height: 100%;
    width: 100%;
    background: #fff;
    display: block;
    position: absolute;
    top: 0px;
    right: -100%;
    z-index: -1;
} */
/* .headerp {
    background: #fff;
    position:relative;
    z-index:999;
} */

JavaScript

$(document).ready(function () {
    var lastScrollLeft = 0;
    $(window).scroll(function () {
        var x = $(window).scrollTop();
        $('.headerp').css({
            top: x,
        });
    });
});