JSFiddle - React, Tailwind, and code Playground
HTML
<div>
<div class="container">
<div>
<div>
Some content Some content Some content Some content Some content Some content Some content Some content Some content Some content Some content Some
</div>
<div class="fixed">
Other content
</div>
</div>
</div>
</div>
CSS
.container {
width: 100%;
height: 100%;
position: absolute;
}
.container > div {
width: 340px;
overflow-y: auto;
overflow-x: hidden;
height: calc(100% - 50px);
border: 1px solid red;
}
.container > div > .fixed {
padding: 10px;
position: fixed;
bottom: 0;
background-color: white;
border: 1px solid green;
width: inherit;
box-sizing:border-box;
}