Пока работает на использованиеcontenteditable атрибут на<div> тегс функцией автоматического увеличения текстового поля, Так жевысота перехода этого, Все это работает хорошо, за исключением одного: удаление символов, а точнее, строки, не будет анимировать ее высоту, в отличие от добавления новых строк. У меня еще немного знаний по CSS.

.autogrow {
  border: 1px solid rgb( 0, 0, 0 );
  padding: 10px;
}
@keyframes line_insert {
  from {
    height: 0px;
  }
  to {
    height: 20px;
  }
}
.autogrow[contenteditable] > div {
  animation-duration: 250ms;
  animation-name: line_insert;
}
.autogrow[contenteditable] {
  overflow: hidden;
  line-height: 20px;
}

<div class="autogrow" contenteditable="true"></div>

Когда я нажимаюсдвиг + Войти, он тоже не оживляет, хорошо работает при нажатииВойти, Просто удаление линий исдвиг + Войти Сочетание клавиш при вводе новой строки является проблемой.

Как заставить это работать? Можно ли это сделать с использованием чистого CSS? Или добавив для этого функцию javascript?