Thuộc tính max-width

Đăng bởi: Admin

Thuộc tính max-width thiết lập chiều rộng tối đa cho thành phần.

tag {
    max-width: giá trị;
}

Với giá trị như sau:

Thuộc tính	giá trị	Ví dụ	Mô tả
max-width	đơn vị	max-width: 50px;	Chiều cao tính từ mép bên trái ngoài cùng của thành phần, đơn vị có thể là px, em, %, ...
	none	max-width: none;	Không sử dụng chiều rộng lớn nhất, đây là dạng mặc định.
	inherit	max-width: inherit;	Xác định thừa hưởng thuộc tính từ thành phần cha (thành phần bao ngoài).

<html>
<head></head>
<body>
<div>
<p>Đoạn text này có chiều rộng lớn nhất là 120px.</p>
</div>
</body>
</html>

div {
    border: 1px solid red;
}

Đoạn text này có chiều rộng lớn nhất là 120px.

div {
    border: 1px solid red;
    max-width: 120px;
}

Đoạn text này có chiều rộng lớn nhất là 120px.

Khi đã sử dụng thuộc tính max-width thì chiều rộng của box sẽ không vượt quá giá trị của max-width

Thuộc tính max-width được hỗ trợ trong đa số các trình duyệt, ngoại trừ IE6.

Giá trị "inherit" trình duyệt IE8 đòi hỏi phải có !Doctype

Theo dõi VnCoder trên Facebook, để cập nhật những bài viết, tin tức và khoá học mới nhất!