Sticky Footer

When content is short, the footer sticks to the bottom; when content grows, the footer moves down naturally.

┌────────────────────────────┐
│ Header                     │
├────────────────────────────┤
│ Content (flex: 1)          │
├────────────────────────────┤
│ Footer                     │
└────────────────────────────┘

Key Rules

• Parent: flexDirection: column
• Content: flexGrow: 1

Code

Related Guides

• Flex Grow
• Size