Нужна помощь с HTML CSS возможно Js Пожалуйста очень срочно

В инпуте под окном ввожу текст и он через js должен выводиться в это самое окно с низу вверх как в вк отправка сообщения и был при этом скролл как мне это сделать помогите
СТИЛЬ
#consol {
width: 300px;
height: 300px;
background: black;
border: 4px solid grey;
border-radius: 10px;
margin-left: 50px;
position: relative;
margin-top: 20px;
padding-left: 5px;
z-index: 0;
overflow: hidden;
}

#console {
border-radius: 5px;
outline: none;
margin-left: 115px;
border: 3px solid grey;
margin-top: 10px;
padding: 3px;
background: silver;
font-family: Consola;
}

#okno {
border-radius: 10px;
margin-left: 50px;
border: 4px solid grey;
color: green;
position: relative;
margin-top: 20px;
padding-left: 5px;
left: 0px;
bottom: 0px;
font-family: Consola;
font-size: 20px;
overflow-y: scroll;
width: 300px;
height: 300px;
}
HTML
(div id="code")
(div id="consol")
(div id="okno")(/div)
(/div)
(input type="text" id="console"/)
(/div)
Вместо <> стоят ()