Skip to content

Instantly share code, notes, and snippets.

@jonas-johansson

jonas-johansson/top-content-bottom.tsx

Created May 16, 2024 19:24
Show Gist options
  • Save jonas-johansson/25dc54e4e0158a281035e1cbf3692395 to your computer and use it in GitHub Desktop.
Save jonas-johansson/25dc54e4e0158a281035e1cbf3692395 to your computer and use it in GitHub Desktop.
Download ZIP
Top, content, bottom with content using flex grow to fill available space
Raw
top-content-bottom.tsx
<div className="flex flex-col min-h-full h-full">
<div className="bg-blue-500">Top</div>
<div className="flex-grow bg-green-500">
<div>Content</div>
</div>
<div className="bg-red-500">Bottom</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment