justify-content

Thuộc tính justify-content xác định cách căn chỉnh trên trục chính.

Trục chính nằm ngang khi hướng là hàng và nằm dọc khi hướng là cột.

Thuộc tính này nhận sáu giá trị:

• flex-start - căn các phần tử về đầu vùng chứa.
• flex-end - căn các phần tử về cuối vùng chứa.
• center - căn các phần tử vào giữa vùng chứa.
• space-between - các phần tử được phân bố đều trên trục. Phần tử đầu tiên nằm ở đầu, phần tử cuối cùng nằm ở cuối.
• space-around - các phần tử được phân bố đều trên trục, với khoảng trống bằng nhau xung quanh chúng.
• space-evenly - các phần tử được phân bố sao cho khoảng cách giữa hai phần tử bất kỳ (và khoảng cách đến các mép) bằng nhau.

Giá trị mặc định của vùng chứa flex là flex-start.

Ví dụ,

.container {
  display: flex;
  justify-content: flex-end;
}