Hordhac ku saabsan `align-items`

Sifada align-items ee Flexbox waxa loo isticmaalaa in lagu hagaajiyo habka ay xubnuhu u kala sarreeyaan (alignment) marka loo eego dhidibka isdhaafka ah (cross axis) ee flex container-ka. Waxay xakamaysaa sida xubnuhu u buuxiyaan booska bannaan ee dhererka dhidibka isdhaafka ah.

Qiimaha Loo Isticmaali Karo

• stretch: Kani waa qiimaha caadiga ah. Xubnuhu waxay u fidsan yihiin inay buuxiyaan dhererka flex container-ka.
• flex-start: Xubnuhu waxay ku hagaagsan yihiin bilowga dhidibka isdhaafka ah.
• flex-end: Xubnuhu waxay ku hagaagsan yihiin dhammaadka dhidibka isdhaafka ah.
• center: Xubnuhu waxay ku hagaagsan yihiin bartamaha dhidibka isdhaafka ah.
• baseline: Xubnuhu waxay ku hagaagsan yihiin iyadoo la eegayo saldhigga qoraalka.

Tusaale 1: Isticmaalka `stretch`

  
Xubin 1
  
Xubin 2
  
Xubin 3

Tusaalahan, xubnaha ku jira flex container-ka waxay u fidsan yihiin inay buuxiyaan dhererka 200px ee container-ka.

Tusaale 2: Isticmaalka `flex-start`

  
Xubin 1
  
Xubin 2
  
Xubin 3

Halkan, xubnuhu waxay ku hagaagsan yihiin bilowga (top) ee flex container-ka.

Tusaale 3: Isticmaalka `center`

  
Xubin 1
  
Xubin 2
  
Xubin 3

Tusaalahan, xubnuhu waxay ku hagaagsan yihiin bartamaha dhererka flex container-ka.

Faa'iidada Isticmaalka `align-items`

align-items waxay fududaysaa hagaajinta xubnaha gudaha flex container-ka, taasoo ka dhigaysa mid sahlan in la abuuro layout-yo isku dheelitiran oo jawaab celin ah. Waxay si gaar ah faa'iido u leedahay marka xubnuhu ay leeyihiin dherer kala duwan.