Что делает свойство overflow в CSS и в каких случаях его следует использовать?

Свойство overflow в CSS определяет, как обрабатывать содержимое, которое выходит за пределы блока элемента.

• visible: Содержимое отображается полностью, выходя за пределы контейнера.
• hidden: Содержимое, выходящее за пределы контейнера, обрезается и не видно.
• scroll: Всегда отображаются полосы прокрутки (горизонтальная и вертикальная), даже если содержимое не выходит за пределы контейнера.
• auto: Полосы прокрутки отображаются только при необходимости (когда содержимое выходит за пределы контейнера).

Использовать следует:

• Когда содержимое элемента (например, текст или изображение) может быть больше, чем заданные для него размеры, и требуется управлять его отображением.
• Для создания прокручиваемых областей внутри страницы, например, для списков, блоков кода или таблиц.
• Для обрезки нежелательного содержимого, выходящего за пределы элемента, чтобы сохранить исходный макет.

Пример использования overflow: auto; для блока с ограниченной высотой:

css