Multi-Sidebar TailwindCss application layout https://play.tailwindcss.com/DJXrYoWBKa

index.html

<div class="h-screen flex overflow-hidden bg-gray-100">
  <div class="hidden md:flex md:flex-shrink-0">
    <div class="flex flex-col w-64 h-screen text-white">
      <div class="flex flex-col flex-grow bg-black p-4 border-r-2 overflow-y-auto">
        <div class="my-20">Outer Sidebar</div>
        <div class="my-20">Outer Sidebar</div>
        <div class="my-20">Outer Sidebar</div>
        <div class="my-20">Outer Sidebar</div>
        <div class="my-20">Outer Sidebar</div>
        <div class="my-20">Outer Sidebar</div>
        <div class="my-20">Letzte Sidebar</div>
      </div>
    </div>
  </div>
  <div class="flex-1 overflow-y-auto focus:outline-none" tabindex="0">
    <div class="flex flex-col h-full">
      <div class="p-4 bg-black text-white">Title</div>
      <div class="md:flex md:h-full">
        <div class="md:w-64 h-full bg-cyan-500 p-4 overflow-auto">
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Inner Sidebar</div>
          <div class="my-20">Letzte Sidebar</div>
        </div>
        <div class="">
          <div class="flex h-full">
            <div class="md:w-96 border-red-600 border-r-2 h-full overflow-auto">
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Inner Sidebar</div>
              <div class="my-20">Letzte Sidebar</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>