Command Palette

Search for a command to run...

Hectal
Phase 7: Flexbox
CSS · Exercise 5 of 6 PreviousNext
Intermediate

Pricing cards with aligned buttons

Lay out the three plans in one row with a 12px gap, each card the same width.

All three cards must be the same height, and every "Choose" button must sit at the bottom of its card, so the three buttons line up, even though the descriptions have different lengths.

What Check tests

  1. The three plans are in one row
  2. The cards are 12px apart
  3. The cards are the same width
  4. The cards are the same height
  5. Each button sits at the bottom of its card

Stuck? One hint at a time

The solution unlocks after your first Check. Try first: that is where the learning happens.

Runs in your browser. Your code is saved here.

Your page

Press Run to see the page.

Console

Nothing logged yet.