Przepełnienie ustalamy za pomocą overflow. Dzięki temu możemy uzyskać nowe efekty w prezentacji poszczególnych elementów na stronie.
selektor { overflow: wartość; }
W przypadku przepełnienia wartość może zawierać jeden z parametrów:
- visible – domyślne
- hidden – zakrywanie nie mieszczącej się zawartości w zadeklarowanych ramach
- scroll – przewijanie
- auto – w razie konieczności pojawią się przewijanie
p { width: 100px; height: 83px; overflow: visible; background: silver; }
Visible
Przykład
Cały tekst jest widoczny, bez przycinania i konieczności pojawienia się przewijania.
Hidden
p { width: 100px; height: 83px; overflow: hidden; background: silver; }
Przykład
Scroll
p { width: 100px; height: 83px; overflow: scroll; background: silver; }
Przykład
Pełny tekst będzie można zobaczyć po przesunięciu suwaka w dół.
Auto
p { width: 100px; height: 83px; overflow: auto; background: silver; }
Przykład
Pełny tekst będzie można zobaczyć po przesunięciu