JSFiddle - React, Tailwind, and code Playground
by lollero
HTML
<div class="parent">
<div>
<div></div>
</div>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eos suscipit blanditiis sapiente tempore placeat cumque eius obcaecati amet quaerat dolores doloremque iusto incidunt vitae modi labore eveniet quis error quos aliquid corporis! Voluptatem voluptates doloremque ducimus beatae ut natus minima labore obcaecati cum delectus temporibus placeat unde eum nobis totam repudiandae vero. Quae accusamus adipisci numquam possimus aut recusandae laboriosam sequi quo non dolorem repellendus inventore saepe deleniti cupiditate aspernatur harum cumque reiciendis officiis et hic consequuntur quod esse fuga ab facere tenetur totam eaque atque placeat veniam neque asperiores vitae aliquam nam accusantium sapiente unde dolore aperiam quidem iure. Nihil perferendis natus nulla numquam cumque sit impedit et fuga officia id optio adipisci facere velit excepturi hic. Commodi magni quod culpa modi velit quia optio voluptas rerum! Odit unde nam corporis fugiat enim quia dicta minima architecto iure sed quo magnam nihil aspernatur consequatur illum rerum ut perferendis odio saepe quod. Quis dolore ex consectetur iste voluptas rerum quaerat excepturi eos ut suscipit tenetur veritatis deleniti totam neque atque omnis quam doloremque molestiae quae fugit enim nobis illum magnam asperiores eius aperiam sequi ullam inventore possimus voluptatibus quasi animi id nam assumenda veniam minima praesentium? Eos maxime aliquam iste rem culpa officiis dolores a! Voluptas consequatur praesentium eum ullam nulla adipisci inventore voluptatum asperiores dicta laudantium laboriosam deserunt velit earum optio eius nemo omnis maxime autem quisquam beatae doloremque obcaecati placeat quis maiores delectus est repellendus dolorum accusamus aliquid deleniti. Aspernatur quidem deserunt inventore assumenda odio necessitatibus architecto velit nihil delectus cumque saepe alias perferendis error est pariatur libero numquam optio...
CSS
.parent {
width: 200px;
height: 200px;
overflow: auto;
/* position: relative; */
}
.parent > div {
/* position: relative; */
z-index: 1;
}
.parent > div > div {
position: absolute;
z-index: 8888888;
top: 0px;
left: 120px;
width: 100px;
height: 60px;
background: red;
opacity: 0.6;
}