modal with max height

Question

Let's create a modal

1. it has header(fixed height: 50px) and stretching body
2. width of 300px and total max height 300px
3. centered in viewport
4. need mininum space of 30px to viewport top and bottom.

The HTML structure is something like

<div class="modals">
  <div class="modal">
    <div class="modal-header"></div>
    <div class="modal-body"></div>
  </div>
</div>

Source

Source From