CSS property - overflow
Home

CSS property - overflow

CSS property - overflow

De eigenschap overflow vertelt de browser wat te doen als de inhoud binnen een blok groter is dan het blok zelf.

Beschrijving

Meestal gebruik je één van deze twee waarden :

  1. hidden Hiermee wordt alles wat niet in het blok past verborgen.
  2. scroll Hiermee voegt de browser een schuifbalk aan het blok toe, zodat gebruikers kunnen scrollen om de overlopende inhoud te zien.

De eigenschap overflow is nuttig omdat gebruikers in sommige browsers de tekstgrootte aan kunnen passen. Als de tekst te groot wordt ingesteld dan kan de pagina een onleesbare puinhoop worden. De overloop in dergelijke blokken verbergen helpt voorkomen dat onderdelen op de pagina gaan overlappen.

Value Description
visible The overflow is not clipped. It renders outside the element's box. This is default
hidden The overflow is clipped, and the rest of the content will be invisible
scroll The overflow is clipped, but a scroll-bar is added to see the rest of the content
auto If overflow is clipped, a scroll-bar should be added to see the rest of the content
initial Sets this property to its default value.
inherit Inherits this property from its parent element.

Vertikaal of horizontaal?

Je kan ook alleen de vertikale of horizontale overflow instellen met overflow-x en overflow-y.

JI
2016-12-07 12:52:39