JSFiddle - React, Tailwind, and code Playground

HTML

<div id="parent">
       <div id="childNorm">some content for regular child</div>
       <div id="childStrech">Some content for streching child</div>
    </div>

CSS

#parent
      {
          position: absolute;
          width: 1000px;
          bottom: 0;
          top: 0;
          margin: auto;
          background-color: black;
      }
      
      #childNorm
      {
         position: absolute;
         width: 1000px;
         top: 0;
         height: 50px;
         background-color: blue;
         color: white;
      }

      #childStrech
      {
         position: absolute;
         width: 1000px;
         top: 50px;
         bottom: 0;
         background-color: red;
         color: white;
      }