Thiết lập min-width và max-width với CSS

Giới hạn chiều rộng tối thiểu và tối đa

Thuộc tính min-width và max-width kiểm soát chiều rộng phần tử, rất quan trọng cho thiết kế responsive.

Ví dụ minh họa

<!DOCTYPE html>
<html>
<head>
  <style>
    div {
      max-width: 300px;
      min-width: 100px;
      background-color: red;
    }
  </style>
</head>
<body>
  <p>Thay đổi kích thước trình duyệt để xem hiệu ứng.</p>
  <div>
    Nội dung demo... (văn bản dài để quan sát co giãn)
  </div>
</body>
</html>

Phần tử div sẽ luôn trong khoảng 100px - 300px. Thường dùng cho container, hình ảnh, hoặc các ô input để tránh quá rộng/hẹp.