Scroll bar to be at the bottom when opened

I want to get the scroll bar at the bottom when the page is opened, instead of the top by default. From my research CSS does not facilitate that. The following is my current coding;

<style type="text/css"> .mem { position: fixed; width: 53%; left: 46%; top: 30%; font-family: arial; font-size: 100%; color: Black; bottom: 3.7%; overflow: auto; } </style>
<div class="mem">

I would like a simple instruction like in the following, but that does not work;

<style type="text/css"> .mem { position: fixed; width: 53%; left: 46%; top: 30%; font-family: arial; font-size: 100%; color: Black; bottom: 3.7%; overflow: auto; scrollToBottom; } </style>

From my research it is only achievable by Javascript.

@RandellDawson you appear to know a little Javascript. Maybe you can help.

Ive searched the following & acquired the coding below but they dont work;

var element = document.getElementById("yourDivID");
element.scrollTop = element.scrollHeight;

<script> var element = document.getElementById("mem"); element.scrollTop = element.scrollHeight; </script>

The Javascript code below should keep your div’s scrollbar positioned at the bottom like you described:
var objDiv = document.getElementById("divExample");
objDiv.scrollTop = objDiv.scrollHeight;

<script> var objDiv = document.getElementById("mem"); objDiv.scrollTop = objDiv.scrollHeight; </script>
1 Like

i know it silly, but have you ever tried remove the attribute top: 30% ?

The top: 30%; is the percentage of the page between the top of the page & the top of the div. It has nothing to do with the the scroll bar.

sorry just realize that .mem is a div
lol