Overflow
overflow - definiuje zachowanie elementu, kiedy jego zawartość się w nim nie mieści.
Możliwe wartości:
- visible - niewycinanie zawartości, więc może być wyświetlona poza blokiem
- Wartość "hidden" - wycinanie zawartości
- scroll - wyświetlanie pasków przewijania
-
Inherit - przejęcie wartości rodzica
Przykłady użycia:
<div style="max-width:100px; max-height: 50px; overflow: visible; border: solid black 1px;"><div style="max-width: 100px; width: 100px; max-height: 50px; height: 50px; overflow: visible; border: solid black 1px;"><div style="min-width: 100px; min-height: 100px; width: 100px; height: 100px;">Oto przykładowy tekst, który nie mieści się w pierwszym elemencie typu div</div></div>
Oto przykładowy tekst, który nie mieści się w pierwszym elemencie typu div
<div style="max-width: 100px; width: 100px; max-height: 50px; height: 50px; overflow: hidden; border: solid black 1px;"><div style="min-width: 100px; min-height: 100px; width: 100px; height: 100px;">Oto przykładowy tekst, który nie mieści się w pierwszym elemencie typu div</div></div>
Oto przykładowy tekst, który nie mieści się w pierwszym elemencie typu div
<div style="max-width: 100px; width: 100px; max-height: 50px; height: 50px; overflow: scroll; border: solid black 1px;"><div style="min-width: 100px; min-height: 100px; width: 100px; height: 100px;">Oto przykładowy tekst, który nie mieści się w pierwszym elemencie typu div</div></div>
Oto przykładowy tekst, który nie mieści się w pierwszym elemencie typu div