Attribut overflow CSS

Définition et utilisation

overflow Cette propriété détermine ce qui se passe lorsque le contenu dépasse la boîte de l'élément.

Description

Cette propriété définit comment le contenu de l'élément en débordement doit être traité. Si la valeur est scroll, l'agent utilisateur fournira un mécanisme de défilement, quel que soit le besoin. Par conséquent, une barre de défilement peut apparaître même si tous les contenus peuvent tenir dans la boîte de l'élément.

Voir également :

Tutoriel CSS :Positionnement CSS

Manuel de référence HTML DOM :Propriété overflow

Exemple

Définir la propriété overflow :

div
  {
  width:150px;
  height:150px;
  overflow:scroll;
  }

Essayez-le vous-même

Syntaxe CSS

overflow: visible|hidden|clip|scroll|auto|initial|hérité;

Valeur de l'attribut

Valeur Description
visible Valeur par défaut. Le contenu n'est pas tronqué et s'affiche en dehors de la boîte de l'élément.
hidden Le contenu est tronqué et le reste du contenu est invisible.
scroll Le contenu est tronqué, mais le navigateur affichera une barre de défilement pour voir le reste du contenu.
auto Si le contenu est tronqué, le navigateur affichera une barre de défilement pour voir le reste du contenu.
hérité Définit que la valeur de la propriété overflow doit être héritée de l'élément parent.

Détails techniques

Valeur par défaut : visible
Héritabilité : non
Version : CSS2
Syntaxe JavaScript : object.style.overflow="scroll"

Plus d'exemples

Comment utiliser la barre de défilement pour afficher le contenu débordant dans un élément
cet exemple montre comment configurer la propriété overflow pour définir l'action correspondante lorsque le contenu de l'élément dépasse la zone spécifiée.
Comment cacher le contenu débordant dans un élément overflow
cet exemple montre comment configurer la propriété overflow pour cacher le contenu lorsque le contenu de l'élément est trop grand pour s'adapter à la zone spécifiée.
Comment configurer le navigateur pour gérer automatiquement les débordements
cet exemple montre comment configurer le navigateur pour gérer automatiquement les débordements.

Prise en charge du navigateur

Les nombres dans le tableau indiquent la version du navigateur la première à prendre en charge cette propriété.

Chrome IE / Edge Firefox Safari Opera
1.0 4.0 1.0 1.0 7.0