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

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

Sử dụng min-height và max-height để kiểm soát chiều cao của phần tử trong phạm vi cho phép, hữu ích cho bố cục responsive.

Ví dụ minh họa

<!DOCTYPE html>
<html>
<head>
  <style>
    div {
      max-height: 550px;
      min-height: 450px;
      background-color: red;
      overflow: auto; /* Thêm thanh cuộn nếu nội dung vượt max-height */
    }
  </style>
</head>
<body>
  <p>Thay đổi kích thước trình duyệt để xem hiệu ứng.</p>
  <div>
    Nội dung demo... (lặp lại nhiều dòng để vượt chiều cao)
  </div>
</body>
</html>

Phần tử div sẽ không co nhỏ hơn 450px và không lớn hơn 550px. Kết hợp overflow: auto để xử lý nội dung tràn.