Giá trị chiều rộng CSS = chiều rộng hiển thị bên trong?Mối quan hệ giữa lề, đệm và chiều rộng trong các trình duyệt khác nhau là gì?
hoặc
Giá trị chiều rộng CSS = chiều rộng hiển thị của bên trong + lề CSS-trái phải không?
Bạn phải tự làm quen với CSS Box Model. Nó giải thích nơi padding, lề và biên giới cũng như chiều rộng làm việc. Tuy nhiên, lưu ý rằng các trình duyệt khác nhau thực hiện điều này một cách khác nhau: đáng chú ý nhất là Internet Explorer has a box model bug (điều này là vô cùng hiện diện trong IE6 - Tôi không biết nếu điều này đã được sửa trong IE7 hoặc IE8) gây ra "chế độ quirks" khét tiếng hack.
Tóm tắt, Internet Explorer đặt mô hình hộp của họ để bao gồm đệm trong tính toán chiều rộng, trái ngược với tiêu chuẩn chính thức trong đó chiều rộng chỉ nên cấu thành nội dung.
Nó không chỉ phụ thuộc vào trình duyệt và phiên bản bạn chọn, mà còn phụ thuộc vào loại tài liệu html của bạn. Internet Explorer trong "chế độ quirks" là ví dụ hoàn toàn khác với trình duyệt Internet với doctype XHTML 1.0 Transitional.
Như đã đề cập bởi những người khác, quy tắc chung là CSS box model. Thao tác này thường được quảng cáo bởi các trình duyệt như Opera, Firefox & Safari. Internet Explorer là ngoại lệ của bạn, trong đó "chiều rộng" bao gồm lề, đệm và đường viền.
Có một số công cụ tuyệt vời ở đó mô tả trực quan cách trình duyệt hiển thị nội dung. Đối với Firefox, hãy kiểm tra Firebug và đối với Internet Explorer, hãy xem Developer Toolbar.
Here bạn có thể thấy biểu đồ hoạt ảnh "phát" hộp.
Tôi nghĩ rằng IE trước phiên bản 6 không chính xác bao gồm đường viền và đệm theo chiều rộng và chiều cao. Xem: Microsoft Admits IE 5 is Messed Up
Nhưng họ đã sửa nó và bạn không phải lo lắng về điều đó miễn là bạn đặt đúng loại tài liệu, để làm cho IE không ở chế độ quirks. – Breton
Vâng, theo IE, tôi có nghĩa là IE6. Tôi sẽ chỉnh sửa câu trả lời của tôi cho điều đó, cảm ơn. :) –