JSFiddle - React, Tailwind, and code Playground

by Jose A

HTML

<div id="holder">
    <div id="inside">
        TEST
    </div>
    <div id="wrap">
        <div id="more-inside"></div>
        <p
    </div>
</div>

CSS

#holder {
    position: relative;
    height: 100%;
    width: 200px;
    /**/
    -webkit-transform: translateZ(0);
    /**/
    background: #000;
    
    
}

#inside {
    position: fixed;
    top: 100px;
    height: 100px;
    right: 0px;
    left: 0px;
    background-color: #f00;
    -webkit-transform: translateZ(0);
}

#wrap {
    height: 100%;
    position: relative;
    box-sizing: content-box;
    -webkit-transform: initial;
    -webkit-transform-style: initial;
    min-height: initial;
}

#more-inside {
    position: fixed;
    padding: 1px;
    top: 250px;
    height: 10px;
    right: 0px;
    left: 0px;
    background-color: blue;
    -webkit-transform: translateZ(0);
}