Max-width, độ rộng tối đa của phần tử trong CSS
Đặc tính width và max: width xác định độ rộng của phần tử.
Như đã được đề cập trước đó, phần tử khối luôn chiếm hết chiều rộng có thể (kéo từ bên trái sang bên phải). Việc thiết lập độ rộng bằng đặc tính width cho phần tử khối sẽ ngăn nó kéo dài tới tận viền ngoài cùng. Sau đó có thể đặt lề tự động, căn giữa cho phần tử theo chiều ngang. Phần tử sẽ chỉ chiếm phần độ rộng đã định sẵn, phần còn lại sẽ được chia đều cho 2 lề.
Lưu ý: Khi độ rộng cửa sổ nhỏ hơn của phần tử, trình duyệt sẽ thêm thanh cuộn ngang cho trang. Trong trường hợp này nên dùng max-width. Việc này vừa giúp trình duyệt dễ xử lý hơn khi cửa sổ quá nhỏ, cũng rất quan trọng trên các thiết bị màn hình nhỏ.
Đây là ví dụ về cách dùng 2 đặc tính width và max-width nói trên.
div.ex1 {
width: 500px;
margin: auto;
border: 3px solid #73AD21;
}
div.ex2 {
max-width: 500px;
margin: auto;
border: 3px solid #73AD21;
}
Thay đổi độ rộng cửa sổ trình duyệt để thấy sự khác biệt
Bài trước: Hiển thị phần tử trong CSS
Bài sau: Vị trí của phần tử trong CSS
Bạn nên đọc
Theo Nghị định 147/2024/ND-CP, bạn cần xác thực tài khoản trước khi sử dụng tính năng này. Chúng tôi sẽ gửi mã xác thực qua SMS hoặc Zalo tới số điện thoại mà bạn nhập dưới đây:


Cũ vẫn chất
-
Code Roblox mới nhất tháng 10 và cách nhập Roblox Promo Code 2025
Hôm qua 6 -
Cách thiết lập VPN trên iPhone hoặc iPad
Hôm qua 3 -
Hướng dẫn đóng dấu ngoặc số âm trong Excel
Hôm qua 1 -
Cách tính BHXH 1 lần, hưởng BHXH 1 lần mới nhất
Hôm qua -
Cap kỉ niệm ngày cưới, stt kỷ niệm ngày cưới ý nghĩa và ngọt ngào
Hôm qua -
Hàm trong Python là gì? Các hàm trong Python
Hôm qua 2 -
Firmware là gì? Firmware khác Software như thế nào?
Hôm qua -
Game luyện chuột, game nhanh tay lẹ mắt trên máy tính
Hôm qua 3 -
45 câu đố vui cho trẻ về nghề nghiệp
Hôm qua -
Mảng trong Python
Hôm qua