<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, user-scalable=no" />
<title>Page Title</title>
<style>
body {
margin:0px;padding:0px;overflow:hidden;
}
iframe {
margin:0;
padding:0;
/* border:none; */
}
#textField {
position:absolute;
left:50%;
top:575px;
transform: translate(-50%);
}
.textarea { display: block; width: 200px; overflow: hidden; resize: both; min-height: 16px; line-height: 16px;
border-style:solid;
padding:5px;
border-radius:15px;
outline-width: 0;
margin:20px;
} .textarea[contenteditable]:empty::before { content: "Text Message"; color: gray; }
</style>
</head>
<body>
<iframe
width=100%
height=555
>
</iframe>
<div src="https://drbw.uk" id="textField"><strong></strong> <span class="textarea" role="textbox" contenteditable></span></div>
<br />
<script>
var scrollInterval = setInterval(function() { document.documentElement.scrollTop = document.documentElement.scrollHeight; }, 2);
</script>
</body>
</html>