Как сделать что бы при достижении определенной высоты блока появился scroll?

Мне нужно сделать что бы был редактируемый блок с текстом, но что бы там можно было писать достаточно большое количество текста нужно что бы там появлялся scroll, вопрос в том, как можно сделать блок с текстом который можно редактировать, но что бы в то же время его высота оставалась равной 150 пикселям в любом случае, а если больше то появлялся бы скролл?

Да очень просто, нужно задать в css свойство max-height – максимальную желаемую вами высоту для этого блока, и overflow-y:auto, в таком случае скролл будет появляться только в случае если есть попытка контентом увеличить размер самого блока:


.
contenteditable {
max-height: 150px;
overflow-y: auto;
}

В html разметке страницы просто прописываем блоку класс contentiable, далее при запуске в браузере нужно дописать еще пару строк контента что бы убедится что его размер не увеличивается больше чем указано в max-height и что появляется scroll при большой высоте контента блока.


<div class="contenteditable" contenteditable>
contenteditable

contenteditable

contenteditable

contenteditable

contenteditable

contenteditable

contenteditable