继续滚动聊天的底部

Question

我目前正在为一个项目的网页上聊天，但我遇到了聊天问题。当我写一条新消息时，消息显示在（隐藏）聊天框下面，我必须手动滚动才能看到消息。我正在使用Jade，CSS和JS，但还没有找到解决方案。

我有一个名为#chatwrapper的div，里面有我的.content

这是Jade

        .formwrapper
           form(id='messageform', action='', method='GET')
           textarea(class='form-control1' type='text' id='messagefield'autocomplete='off') 
           input(class='pure-button' type='submit' id='sendmessage' value='send') 

这是CSS

#chatwrapper {
  float: left;
  background-color: none;
  height:100%;
  width:380px;
  text-align: center;
  color: white;
  margin-left: 5px;
  margin-right: 5px;
}

内容的CSS

    #chatwrapper .content, #feedwrapper .content{
  height: 440px;
  overflow: auto;
  background-color: #EDEDED;
  margin: 6px;
  border-radius: 5px;
  box-shadow: 0 0 3px 1px #888888;