როგორ შევცვალოთ flexbox კონტეინერის ღერძის მიმართულება?

CSS თვისება flex-direction-ის დახმარებით.

/* მთავარი ღერძი მარცხიდან მარჯვნივ განსაზღვრა */
.container {
  display: flex;
  flex-direction: row; 
}

/* მთავარი ღერძი მარჯვნიდან მარცხნივ განსაზღვრა */
.container {
  display: flex;
  flex-direction: row-reverse;
}

/* მთავარი ღერძი ზევითიდან ქვემოთ განსაზღვრა */
.container {
  display: flex;
  flex-direction: column;
}

/* მთავარი ღერძი ქვემოდან ზევით განსაზღვრა */
.container {
  display: flex;
  flex-direction: column-reverse;
}

მნიშვნელობა	აღწერა
row	მთავარი ღერძი მარცხიდან მარჯვნივ (ნაგულისხმევი)
row-reverse	მთავარი ღერძი მარჯვნიდან მარცხნივ
column	მთავარი ღერძი ზევითიდან ქვემოთ
column-reverse	მთავარი ღერძი ქვემოდან ზევით