Chỉ cần không thể tìm ra tình huống khi bộ quy tắc thông minh này có thể hữu ích. Chúng phá vỡ sự đơn giản của mô hình hộp và cung cấp nguồn rắc rối vô hạn khi bạn kết hợp các phần bố cục khác nhau với nhau. Vậy lý do là gì?Vì những nguyên tắc nào về lý do thu gọn ký quỹ được giới thiệu trong CSS?
Rules để tham khảo.
Cập nhật: Quy tắc khá hợp lý đối với các phần tử anh chị em, nhưng tại sao lề nên truyền cho các phần tử gốc lên đến cây? Loại vấn đề nào giải quyết được?
Ví dụ:
<div style="margin: 20px; background-color: red;">
<div style="margin: 20px;">
<p style="margin: 100px;">red</p>
</div>
</div>
<div style="margin: 20px; background-color: blue;">blue</div>
divs cấp cao nhất được đặt cách nhau từ mỗi khác bởi 100px.
Thực ra, tôi sẽ thích thay thế cho độ sắc nét của nó. Mặc dù tôi đồng ý trong một số tình huống thu hẹp lề giúp. –
Điều đó khá hợp lý đối với các yếu tố anh chị em. Nhưng tôi vẫn chưa hiểu tại sao lợi nhuận của các elemnt trẻ em sẽ ảnh hưởng đến lợi nhuận của phần tử cha. – actual
@actual: Khoảng cách giữa phần tử con và ranh giới của phần tử gốc phải giống nhau bất kể các phần tử xung quanh. Các phần tử xung quanh không thể giới thiệu khoảng cách giữa các ranh giới của phần tử cha và phần tử con, vì điều đó có thể thay đổi kích thước của phần tử gốc, do đó lề cũng phải đẩy phần tử cha đi xa, không chỉ phần tử con. – Guffa