Thuộc tính min-width
Định nghĩa và sử dụng Thuộc tính min-width thiết lập chiều rộng tối thiểu (nhỏ nhất) cho thành phần. Sử dụng khi giới hạn chiều rộng nhỏ nhất cho thành phần, không làm mất background khi text ít hơn hay khi zoom window. Cấu trúc tag { min-width: giá trị; } Với thuộc tính và […]
Định nghĩa và sử dụng
- Thuộc tính min-width thiết lập chiều rộng tối thiểu (nhỏ nhất) cho thành phần.
- Sử dụng khi giới hạn chiều rộng nhỏ nhất cho thành phần, không làm mất background khi text ít hơn hay khi zoom window.
Cấu trúc
tag {
min-width: giá trị;
}
Với thuộc tính và giá trị như sau:
| Thuộc tính | giá trị | Mô tả |
|---|---|---|
| min-width | đơn vị | Chiều rộng 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, %, … |
| 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). |
Ví dụ
Html viết:
<html> <head></head> <body> <div> <span>Đoạn text này có chiều rộng tối thiểu là 500px.</span> </div> </body> </html>
Hiển thị trình duyệt khi chưa có CSS:
Đoạn text này có chiều rộng tối thiểu là 500px.
CSS viết:
div {
border: 1px solid red;
min-width: 500px;
}
Hiển thị trình duyệt:
Đoạn text này có chiều rộng tối thiểu là 500px.
Khi nội dung mở rộng thì chiều rộng của box được tăng thêm, nhưng khi nội dung thu hẹp (zoom window) thì giá trị chiều rộng nhỏ nhất sẽ bằng với giá trị min-width, chiều rộng lúc này không thể nhỏ hơn giá trị min-width.
Trình duyệt hỗ trợ
- Internet Explorer
- Firefox
- Opera
- Google Chrome
- Safari