overflow-y CSS propriété

Définition de la CSS overflow-y.

La propriété CSS overflow-y permet de gérer la manière dont est rogné verticalement le contenu lorsque votre contenu est plus haut que la hauteur spécifié de votre élément. La propriété CSS overflow-y gère aussi, la manière dont est affiché les barres de défilement vertical de l'élément (scrollbar).

Exemple de syntaxe CSS overflow-y :

overflow-y : auto;
overflow-y : visible;
overflow-y : scroll;
overflow-y : hidden;

La propriété de feuille de style overflow-y CSS peut prendre la valeur de rognage :

visible : rend visible tout ce qui dépasse de l'élément et ne met pas de barre de défilement. Valeur par défaut.
hidden : cache tout ce qui dépasse de l'élément et ne met pas de barre de défilement (scrollbar).
scroll : cache tout ce qui dépasse de l'élément et met toujours une barre de défilement verticale.
auto : met une barre de défilement verticale si besoin.
inherit : hérite de la propriété CSS overflow-y de son parent (CSS2).

Exemple de code overflow-y CSS

Conditions d'application de la CSS overflow-y.

La propriété CSS overflow-y est applicable sur toutes les balises HTML ou XHTML dont on a précisé la propriété CSS height ou max-height et qui ne sont pas de type display:inline.

La valeur de la CSS overflow-y peut être mise directement dans la propriété de raccourci CSS overflow.

Problème d'interprétation de overflow-y en Css.

Attention, pour les versions Internet Explorer < 7 pour overflow-y:visible le bloc s'adapte au contenu.

Règles de syntaxes CSS pour overflow-y.

Complément sur overflow-y

Quand vous faites un overflow-y autre que visible, la propriété CSS overflow-x fonctionne comme si elle était à auto.

Compatibilités navigateurs de la propriété overflow-y

Détails des versions de la CSS overflow-y: Propriété overflow-y css n'est pas compatible W3C; Propriété overflow-y est compatible avec CSS3 et plus.

Résumé du support navigateurs de la CSS overflow-y: Propriété CSS overflow-y est compatible à partir de Chrome 1; Propriété CSS overflow-y est compatible à partir de Firefox 1.5; Propriété CSS overflow-y est compatible à partir de Internet Explorer 6; Propriété CSS overflow-y est compatible à partir de Opera 9.5; Propriété CSS overflow-y est compatible à partir de Safari 3

Equivalence de la CSS overflow-y en HTML.

La propriété de feuille de style overflow-y CSS n'a pas d'équivalence en HTML.

Exemples et astuces CSS pour utiliser overflow-y

Infos complémentaires Firefox/Nestcape

Comme vous pouvez le constater la feuille de style ou css (cascading style sheets) overflow-y n'est pas compatible avec les navigateurs comme Firefox >1.5/Nestcape.
Pour faire le même effet vous devez utilisez le code suivant :

Exemple de code :

#dmcscroll{
display: block;
overflow:hidden;
overflow-x: hidden;
overflow-y: auto;
overflow : -moz-scrollbars-vertical;
}

Exemple :

Dmc aime les css et les feuilles de style Dmc aime les css Dmc aime les css et les feuilles de style Dmc aime les css Dmc aime les css et les feuilles de style Dmc aime les css

Copie d'écran

Votre avis sur la définition overflow-y en CSS

Votez pour la définition CSS `overflow-y`

Votes: 4.1 / 5 - 27 votes
Cliquez sur une étoile pour voter.

Définitions annexes à la Css overflow-y

Définitions CSS annexes overflow-y

display: La propriété CSS DISPLAY permet de modifier le type de rendu d'un élément.Exemple d'écriture CSS de display display : block; display : inline; display...[ display ]
height: La propriété de Hauteur CSS HEIGHT permet de spécifier la hauteur de la zone de contenu d'un élément (X)HTML dit de type block. Exemple d'écriture CSS...[ height ]
max-height: La propriété de Hauteur CSS MAX-HEIGHT permet de spécifier la hauteur maximale de la zone de contenu d'un élément (X)HTML dit de type block. Exemple d...[ max-height ]
overflow: La propriété CSS OVERFLOW un raccourci qui permet de gérer la manière dont est rogné le contenu lorsque votre contenu est plus grand que la taille spé...[ overflow ]
overflow-x: La propriété CSS OVERFLOW-X permet de gérer la manière dont est rogné horizontalement le contenu lorsque votre contenu est plus large que la longueur ...[ overflow-x ]