Mục đích là chia đều độ rộng giữa các cột trong web. Có 2 điều kiện:
1. Xài thuộc tính justify-content, gán giá trị là space-between (nghĩa là không gian giữa các cột).
2. Tổng độ rộng của tất cả cột phải nhỏ hơn 100%, vì nó sẽ lấy phần dư để chia đều ra.

Ví dụ:

[css] .class{
display:flex;
justify-content: space-between;
}

.class .cot1{
width:30%;
}

.class .cot2{
width:30%;
}

.class .cot3{
width:30%;
}
[/css]

Ở trong ví dụ này bạn thấy là:
– Ở lớp tính cha (class) mình đã xài thuộc tình là justify-content, gán giá trị là space-between.
– Có 3 lớp con (.cot1 .cot2 .cot3) mỗi lớp chỉ rộng 30%, vậy tổng là 90%.
– 10% còn lại nó sẽ chia đều ra, đặt vào khoảng cách giữa 3 cột.

Trần Thành
Follow me

Leave a Reply

Your email address will not be published. Required fields are marked *