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

<script type="text/javascript">
  tailwind.config = {
    theme: {
      extend: {
        gridTemplateColumns: {
          sidebar: 'minmax(150px, 25%) 1fr',
        }
      }
    }
  }
</script>

<div class="grid grid-cols-sidebar fixed h-screen w-full">
  <div class="section bg-yellow-300" contenteditable>
    Min: 150px / Max: 25%
  </div>
  <div class="section bg-purple-300" contenteditable>
    This element takes the second grid position (1fr), meaning
    it takes up the rest of the remaining space.
  </div>
</div>