Lesson 20 of 3067%

(Progress persistence is disabled until Phase 9)

Tailwind CSS
Beginner

Justify Content

Aligning flex items along the main axis.

Control alignment on the main axis (horizontal in a row, vertical in a column).

  • justify-start
  • justify-center
  • justify-end
  • justify-between
  • justify-around
<div class="flex justify-between bg-gray-200 p-4">
  <div>Left side</div>
  <div>Right side</div>
</div>
Try It Yourself

Lesson Progress

Ready to practise?

Apply what you learned with a hands-on challenge.

Practise This Topic