Is it possible to rotate an iframe, and then the content inside it, separately, to achieve the effect of a bottom-bound scrollbar? The research I've done on this hasn't clearly stated if its possible or what this would look like, but I've been trying to create an effect of a chat box, always being scrolled to the available bottom to see new messages without scrolling down every time.

<div class="demo">
    <iframe src="page1.php" style="background-color: purple" width="1200" height="500" scrolling="yes" name="myIframe" ;
            id="myIframe" ; class="demo"></iframe>
</div>
<form method="post" action="page2.php"/>

<script>
    const iframe = document.querySelector('iframe');
    document.querySelector('button').addEventListener('click', function () {
         iframe.contentWindow.scrollTo(0, iframe.contentDocument.documentElement.scrollHeight);
    })
   
</script>