CSS overflow: auto

Tự động thêm thanh cuộn khi cần

overflow: auto chỉ hiển thị thanh cuộn (ngang/dọc) khi nội dung thực sự tràn khỏi hộp chứa. Đây là giá trị phổ biến nhất cho container nội dung động.

Ví dụ minh họa

<!DOCTYPE html>
<html>
<head>
  <style>
    div {
      background-color: orange;
      width: 250px;
      height: 45px;
      border: 2px solid blue;
      overflow: auto; /* Tự động cuộn khi cần */
    }
  </style>
</head>
<body>
  <h1>Tiêu đề</h1>
  <div>Nội dung demo... Thanh cuộn chỉ xuất hiện nếu nội dung vượt khung.</div>
</body>
</html>

Khác với overflow: scroll luôn hiển thị thanh cuộn (dù có cần hay không), auto thông minh hơn, giao diện sạch hơn.