JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.perfect-scrollbar/0.5.9/perfect-scrollbar.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.perfect-scrollbar/0.5.9/perfect-scrollbar.min.js"></script>
<div id="Demo">
<div class="chat-messages">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque non volutpat felis. Pellentesque at est risus. Donec eu elit eleifend, ultrices ligula sed, dictum nisl. Suspendisse sed elit ac nunc sodales lacinia id eget velit. Pellentesque consequat, velit vitae faucibus gravida, tortor purus iaculis tellus, non euismod mi dolor nec justo. Etiam at velit purus. Suspendisse nec elit bibendum ante rutrum cursus. Fusce vel laoreet eros. Nunc arcu magna, feugiat non elementum sit amet, ornare vel dolor.
</p>
<p>
Vestibulum risus ligula, lobortis eget congue non, euismod efficitur metus. Vivamus augue nisl, molestie eu metus sed, maximus ullamcorper erat. Aenean scelerisque egestas nisl. Vestibulum a eleifend ipsum, nec molestie erat. Proin in volutpat ante. Pellentesque rhoncus turpis eu bibendum faucibus. Proin imperdiet scelerisque urna, ut mollis est tincidunt vel. Curabitur pulvinar purus velit, id iaculis ipsum rhoncus sed. Etiam at elit enim. Sed sit amet finibus elit. Vestibulum sollicitudin congue ante.
</p>
<p>
Sed dictum interdum enim. Integer efficitur augue elit. Nullam faucibus eu ante vitae tempor. Etiam et laoreet metus. Nullam vehicula neque risus, vel lobortis lacus sodales id. Aliquam ut urna blandit, tincidunt est consectetur, ultrices dui. Quisque venenatis viverra ex non tempus. Cras posuere tempus sodales. Suspendisse sagittis tincidunt porta. Duis fermentum pellentesque nulla sollicitudin egestas.
</p>
<p>
Fusce vel lacinia lacus, id pharetra metus. Mauris luctus, orci quis maximus feugiat, velit nisl auctor leo, rutrum commodo lorem ante a arcu. Nullam sodales dapibus diam nec dignissim. Donec sed tortor...
CSS
.chat-messages {
position: fixed;
height: 300px;
overflow: hidden;
}
JavaScript
$(function () {
$('.chat-messages').perfectScrollbar({suppressScrollX: true});
});