Mission 5: Align

เป้าหมายของ Mission นี้: จัดตำแหน่งตามแกนรองด้วย align-items

align-items

align-items ควบคุมการจัดวางตาม แกนรอง (cross axis) — แกนตั้งฉากกับ flex-direction ค่าที่ใช้บ่อย: stretch (ยืดเต็มความสูง, ค่าเริ่มต้น), flex-start (ชิดบน), center (กึ่งกลาง), flex-end (ชิดล่าง)

Demo

.wrapper {
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  align-items: center;
}