Własność CSS overflow-y

Własność CSS overflow-y określa sposób postępowania z treścią, która nie mieści się w zawierającym ją elemencie w pionie. Do takiej sytuacji dochodzi na przykład, gdy element zawierający treść ma określoną wysokość za pomocą własności height.

Wartości i składnia

Własność CSS overflow-y przyjmuje jedno słowo kluczowe z następującego zestawu: visible, hidden, clip, scroll, auto.

Opis tych wartości wraz z przykładami użycia znajduje się na stronie Własność CSS overflow.

Przykład

<style>
div {
  width: 300px;
  height: 100px;
  overflow-y: clip;
}
</style>
<div>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</div>

Efekt:

W tym przykładzie własności overflow-y została nadana wartość clip, co spowodowało obcięcie treści niemieszczącej się w elemencie i niepokazanie żadnego paska przewijania, który umożliwiałby dotarcie do obciętej części użytkownikowi.

Zastosowanie

Własność CSS overflow-y ma zastosowanie do kontenerów blokowych, flex i siatkowych (ang. grid).

Podsumowanie