JSFiddle - React, Tailwind, and code Playground

by Rosi Ramoreez

HTML

<!-- content to be placed inside <body>…</body> -->
<div id="outer">Outer DIV
  <div id="inner">Inner DIV</div>
</div>
<p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p>fdsfd

CSS

/**
 * Fixed inner div
 */

#outer {
    /* If the transform is uncomented, inner div will not be fixed anymore */
    /*
    -webkit-transform: translate(0px, 0px) translateZ(0px);
    -moz-transform: translate(0px, 0px);
    */
    position:absolute;
    padding: 20px;
    background: yellow;
    height:1000px;
    bottom:0;
}

#inner {
    position:fixed;
    padding: 20px;
    background-color:#0000ff
}