I would like to have 3 columns with the same height in tailwind.

-------------------------------------------------------------------------------------
|                    |                                         |                    |
|                    |                                         | SCROLLABLE CONTENT |
| SCROLLABLE CONTENT | THIS DICTATES THE HEIGHT OF THE COLUMNS |                    |
|                    |                                         | -------------------|
|                    |                                         |        INPUT       |
-------------------------------------------------------------------------------------

Basically the column in the middle will dictate the height of all the other columns (which will be an aspect ratio of video size – 16:8).

I have tried:

<div class="grid grid-cols-12">
  <div class="col-span-2 flex flex-col gap-2 overflow-y-auto border border-indigo-500">
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
    <div>Character X</div>
  </div>
  <div class="col-span-8 aspect-video max-h-max">THIS DICTATES THE HEIGHT OF THE COLUMNS</div>
  <div class="col-span-2 overflow-y-auto">
    <div class="h-20 bg-gray-200">
      This is a message
    </div>
    <div class="h-20 bg-gray-200">
      This is a message
    </div>
    <div class="h-20 bg-gray-200">
      This is a message
    </div>
    <div class="h-20 bg-gray-200">
      This is a message
    </div>
    <div class="h-20 bg-gray-200">
      This is a message
    </div>
    <div class="h-20 bg-gray-200">
      This is a message
    </div>
  </div>
</div>

The THIS DICTATES THE HEIGHT OF THE COLUMNS div should dictate the height of the two adjacent columns:

How can I get the middle column to dictate the height of the other two columns AND make SCROLLABLE CONTENT on the right column to take as much space as possible alongside input?