Если содержимое в блоке выходит за пределы, перенести в другой
У меня есть блок page в виде страницы для печати.
.page{
max-width: 21cm;
max-height: 29.7cm;
min-width: 21cm;
min-height: 29.7cm;
padding: 0.5cm;
margin: 0.5cm auto;
border: 1px #D3D3D3 solid;
border-radius: 5px;
background: white;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
<div class="page" style="font-size: 14px;">
тут содержимое и блок в котором можно менять содержимое
<div class="edit" contenteditable></div>
и тут продолжение
</div>
Когда пользователь изменяет содержимое блока edit, если контент выходит за пределы родительского блока page, создать еще блок page и то, что вышло за пределы этого блока, перенести это туда. Как это сделать?