align-items: menyilang main axis

align-items bekerja pada cross axis — tegak lurus dari main axis. Pada row, cross axis vertikal, jadi align-items mengatur atas-bawah. Kombinasi justify-content: center + align-items: center adalah cara paling ringkas memusatkan sesuatu secara sempurna, menggantikan trik-trik lama yang rumit. Nilai bawaannya stretch, dan itulah sebabnya kartu-kartu dalam satu baris flex otomatis sama tinggi meski panjang isinya berbeda.

.pembungkus {
  display: flex;
  height: 200px;
  justify-content: center;  /* kiri-kanan (main axis)  */
  align-items: center;      /* atas-bawah (cross axis) */
}