title: Force scrollbar to bottom
body: <p>I am making a little messaging / chat system that is working nice and fine. The problem is, the <code>&lt;div&gt;</code> which the messages are outputted to does not scroll the way I need it to.</p>
  
  <p>All the new messages are added to the bottom of the div and when more are added and the scrollbar shows up, the scrolling stays at the top of the <code>&lt;div&gt;</code>. <strong>I need this to be reversed, so that the scrolling always sticks to the bottom of the <code>&lt;div&gt;</code></strong>.</p>
  
  <p>A good example of what I want would be <strong>Steam's chat windows</strong>, or even this text input which I am using to fill out the question.</p>
  
  <p>As I would like to avoid <strong>jQuery</strong>, this has me completely stuck. If you could point me in the correct direction that would be great! I am not sure if <strong>HTML</strong> and <strong>CSS</strong> can handle this, or if <strong>JavaScript</strong> is necessary at all.</p>