overflow

Hérité : non   -   Compatibilité : FF, Mozilla, Opera, Safari IE 4,5,6,7 CSS 2

Définit la façon dont l'élément doit traiter un contenu dont les dimensions dépassent la hauteur et/ou la largeur spécifiées du conteneur. A l'exception de certains types de contenus qui exigent une largeur fixe (éléments pre, par exemple), un élément respecte par défaut la propriété width et règle tout problème de débordement en jouant sur la hauteur. Il est assez dangereux dans le cadre de la compatibilité entre les navigateurs d'attribuer la propriété overflow à l'élément body pour essayer de contrôler l'affichage des barres de défilement. Effectuez des tests approfondis sur votre code.

Si cette propriété a pour valeur visible, le conteneur est redimensionné en fonction de la largeur (si celle-ci est fixe) et de la hauteur du contenu. Si des bordures, des marges et un remplissage ont été définis pour l'élément, ils sont conservés dans le bloc de contenu redimensionné. Si la hauteur et la largeur, ainsi qu'une image ou une couleur d'arrière-plan, sont spécifiées pour l'élément, et si le contenu dépasse la taille définie, les résultats varient avec la famille de navigateurs. IE pour Windows étend la hauteur de l'arrière-plan pour pouvoir accueillir le contenu; le contenu suivant sera repoussé vers le bas pour accueillir le contenu excédentaire.

Si la propriété a pour valeur hidden, le bloc de contenu doit respecter les paramètres de hauteur et de largeur du conteneur, ce qui peut se traduire, dans certains cas, par un détourage du contenu. Les bordures et le remplissage sont conservés, mais il se peut que les marges disparaissent le long des bords détourés. Cette valeur n'entraîne pas l'affichage de barres de défilement.

Si la propriété a pour valeur scroll, des barres de défilement horizontal et vertical s'affichent normalement dans le rectangle du bloc de contenu, même si elles ne sont pas nécessaires. Ces barres ne sont activées que s'il est nécessaire de faire défiler le contenu dans un sens ou dans l'autre.

Si la propriété a pour valeur auto, les barres de défilement sont affichées uniquement si le contenu du bloc l'exige. En pratique, les navigateurs ajoutent uniquement une barre de défilement vertical lorsque le contenu est de type texte et peut s'ajuster à la largeur spécifiée de son conteneur.

Syntaxe CSS
overflow: constante
Valeur(s) possible(s) pour cette propriété :

L'une des constantes suivantes: auto | hidden | scroll | visible.

Valeur initiale

visible

Exemple
div.aside {position: absolute; top: 200px; left: 10px; height: 100px;
width: 150px; overflow: scroll}
S'applique à 

Eléments de niveau bloc, éléments remplacés (IMG, INPUT, TEXTAREA, SELECT et OBJECT) et éléments positionnés.

Javascript
[window.]document .getElementById("elementID") .style .overflow

behavior
filter (old style)
filter (new style)
ime-mode
layout-flow
layout-grid-char
layout-grid-line
layout-grid-mode
layout-grid-type
layout-grid
overflow-x
overflow-y
scrollbar-3dlight-color
text-align-last
text-autospace
text-justify
text-kashida-space
text-underline-position
word-break- word-wrap
word-spacing
writing-mode- zoom




Ce site vous a plu ? Visitez aussi : Conception de sites Internet et Le design des sites Web


Cette page est inspirée d'un texte anglophone extrait du livre HTML - Definitive Reference.
L'adaptation de ce texte a été réalisée par css-faciles.
Son contenu peut être recopié sous la condition express de faire figurer la présente mention
(y compris les 2 liens ci-dessus) dans le contenu copié.
This work is licensed under a Creative Commons License.
Pour plus de détail sur ce copyright,
consultez notre page consacrée aux droits de copie.


Valid HTML 4.01 Transitional
Raccourcis
Contact liens d'évitement et raccourcis clavier Droits de copie Accueil Imprimer
Aller au menu