Reports

Ok i got it C3roe just had to add absolute h-full to image tag. Is there any way without relative absolute class.

<script src="https://cdn.tailwindcss.com"></script>

<div class="flex flex-col h-screen gap-2 p-2">
    <div class="flex gap-1 bg-orange-400 grow">
      <div class="relative w-3/5 flex justify-center bg-white">
        <img src="https://picsum.photos/800/1000" class="absolute h-full rounded-lg object-fit" />
      </div>
      <div class="w-2/5 flex flex-col rounded-lg border-2 border-slate-200">
        This is second child of the first child of root. The parent is set to grow and it should not grow beyond red box.
      </div>
    </div>
    <div
      class="flex flex-col p-1 bg-red-500 text-white">
      This is second child of the parent div which stays at bottom.
    </div>
  </div>

79600016