column

margin-top: auto

function redator(divId) {
  const root = document.getElementById(divId)
  const a4 = {
    height: 830,width: 595,lineHeight: 30
  };
  const template = document.querySelector('#template');
  const headerHeight = root.querySelector('#page-1 .header').offsetHeight;
  const footerHeight = root.querySelector('#page-1 .footer').offsetHeight;

  const getChildrenHeight = (element) => {

    total = parseFloat(getComputedStyle(element).paddingBottom);

    if (element.childNodes) {
      for (let child of element.childNodes) {
        switch (child.nodeType) {
          case Node.ELEMENT_NODE:
            total += child.offsetHeight;
            break;
          case Node.TEXT_NODE:
            let range = document.createRange();
            range.selectNodeContents(child);
            rect = range.getBoundingClientRect();
            total += (rect.bottom - rect.top);
            break;
        }
      }
    }
    return total;
  };

  const getPageHeight = (content) => {
    const children = getChildrenHeight(content);
    return children + headerHeight + footerHeight;

  };

  const setSelection = (node,offset) => {
    let range = document.createRange();
    let sel = window.getSelection();
    range.setStart(node,offset);
    range.collapse(true);
    sel.removeAllRanges();
    sel.addRange(range);
  };

  const addPage = () => {

    const newPage = template.cloneNode(true);
    const pages = root.getElementsByClassName('page');

    newPage.id = 'page-' + (pages.length + 1);
    newPage.className = 'page';
    root.appendChild(newPage);
    newPage.querySelector(".content").focus();
    newPage.querySelector(".content").addEventListener('input',onInput);

    newPage._emptyPage = true;
    return newPage.querySelector(".content");
  };

  function onInput(e) {
    const content = this;
    const page = this.closest(".page")
    const previousPage = page.previousElementSibling;
    const nextPage = page.nextElementSibling;

    const pageHeight = getPageHeight(content);
    const lastChild = content.lastChild;
    const cloneChild = lastChild.cloneNode(true);
    const textContent = content.innerText;
    if ((pageHeight === 0 || textContent.length <= 1) && !!previousPage && !page._emptyPage) {
      page.remove();
      previousPage.querySelector(".content").focus();
      const lastChild = previousPage.querySelector(".content").lastChild;
      setSelection(lastChild,lastChild.childNodes.length);
    } else if (pageHeight > a4.height && !nextPage) {
      lastChild.remove();
      addPage().appendChild(cloneChild);
    } else if (pageHeight > a4.height && nextPage) {

      lastChild.remove();
      nextPage.querySelector(".content").insertBefore(cloneChild,nextPage.querySelector(".content").firstChild);
      let selection = getSelection().getRangeAt(0).startContainer.parentElement.closest('div');
      if (selection === page.lastChild) {
        setSelection(cloneChild,0);
      }
    } else if (pageHeight < a4.height - a4.lineHeight && !!nextPage) {
      let firstChildOfNextPage = nextPage.firstChild;
      let clone = firstChildOfNextPage.cloneNode(true);
      firstChildOfNextPage.remove();
      page.appendChild(clone);
    }
    page._emptyPage = false;
  }

  document.execCommand("DefaultParagraphSeparator",false,"div");
  root.querySelector('#page-1 .content').addEventListener('input',onInput);
}

document.addEventListener('DOMContentLoaded',function() {
  redator('editor');
},false);
redator('editor');

let bodyMHeight = $(".page").height() - $(".header").height() - $(".footer").height();

$(".body").on("input",function() {
   //console.log($(".body").height(),bodyMHeight);
   if($(".body").height() > bodyMHeight){
      //console.log("over");
      $(this).attr("contenteditable","false");
   }else{
      //console.log("not over");
   }
});

body{
  margin: 0;
}

.page{
   display: flex;
   flex-flow: column;
   height: 100vh;
   min-height: 250px;
}

.header {
  background-color: red;
  text-align: center;
}

.header img {
   height: 100px;
}

.body{
  flex: 1;
  overflow-wrap: break-word;
}

.footer {
  background-color: darkgray;
  min-height: 100px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="editor">
  <div class="page" id="page-1">
    <div class="header">
      <img class="brasao" alt="brasao-rj*" src="https://i.imgur.com/ktmBQCS.png" />
      <span>Procuradoria Geral do Estado do Rio de Janeiro</span>
    </div>
    <div class="body" contenteditable="true"> 
        <b>hello</b>
    </div>
    <div class="footer">
      Rua Carmo do Cajuru 128
    </div>
  </div>
</div>