Thu gọn lề CSS
Đôi khi hai lề thu gọn lại thành một lề duy nhất.
Thu gọn ký quỹ
Lề trên và dưới của các phần tử đôi khi được thu gọn thành một lề duy nhất bằng lề lớn nhất trong hai lề.
Điều này không xảy ra ở lề trái và lề phải! Chỉ lề trên và dưới!
Hãy xem ví dụ sau:
Thí dụ
Minh chứng của sự sụp đổ ký quỹ:
h1 {
margin: 0 0 50px 0;
}
h2 {
margin: 20px 0 0 0;
}
Trong ví dụ trên, phần tử <h1> có lề dưới là 50px và phần tử <h2> có lề trên được đặt thành 20px.
Theo lẽ thường, dường như lề dọc giữa <h1> và <h2> sẽ là tổng cộng 70px (50px + 20px). Nhưng do ký quỹ bị thu hẹp, ký quỹ thực tế cuối cùng là 50px.
Tất cả các thuộc tính lề CSS
Property | Description |
---|---|
margin | A shorthand property for setting the margin properties in one declaration |
margin-bottom | Sets the bottom margin of an element |
margin-left | Sets the left margin of an element |
margin-right | Sets the right margin of an element |
margin-top | Sets the top margin of an element |