JSFiddle - React, Tailwind, and code Playground

HTML

<div class="page-break">  
   <div class="menu-item-div">
      <!-- CONTENT WITHIN DIV -->
   </div>

   <div class="menu-item-div">
      <!-- CONTENT WITHIN DIV -->
   </div>

   <div class="menu-item-div">
      <!-- CONTENT WITHIN DIV -->
   </div>
</div>

CSS

.page-break {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 21cm;
    border: 1px solid green;
}
.menu-item-div {
    background: tomato;
    height: 40px; /* If there was real content in the markup this would not be necessary */
}