tailwind-app-container-debug.html

<div class="fixed inset-0 overflow-auto
  bg-yellow-200">

  <div class="w-full h-full min-w-[500px] min-h-[500px] flex
    [--pattern-fg:black] bg-[size:50px_50px] bg-[image:repeating-linear-gradient(315deg,_var(--pattern-fg)_0,_var(--pattern-fg)_5px,_transparent_0,_transparent_50%),repeating-linear-gradient(45deg,_var(--pattern-fg)_0,_var(--pattern-fg)_5px,_transparent_0,_transparent_50%),radial-gradient(black,transparent)]">

      <!-- Example content -->
      <div class="flex-1 flex bg-red-500 m-5 p-5">
        <div class="flex-1/3 bg-blue-500"></div>
        <div class="flex-2/3 bg-blue-100"></div>
      </div>

  </div>

</div>

tailwind-app-container.html

<div class="fixed inset-0 overflow-auto">
  <div class="w-full h-full min-w-[500px] min-h-[500px] flex">
    <!-- 
      1. App layout content as flex children goes here.
      2. Don't use fixed on anything else.
      3. Resize min app dimensions (the size that needs scrollbars below that).
    -->
  </div>
</div>