max-height
Définit la hauteur maximale d’un élément.
Syntaxe
{ max-height: sMaxHeight }
Valeurs possibles
sMaxHeight
Variante qui spécifie la hauteur maximale d’un élément :
length |
Nombre à virgule flottante suivi d’un indicateur d’unités absolues ( cm , mm , in , pt ou pc ) ou d’un indicateur d’unités relatives ( em , ex ou px ). Pour plus d’informations sur les unités de longueur prises en charge, voir Référence des unités de longueur. |
percentage |
Nombre entier suivi d’un signe pourcentage (%) spécifiant un pourcentage de la hauteur du bloc conteneur à utiliser en tant que hauteur maximale de l’élément. Si la hauteur du bloc conteneur n’est pas explicitement définie, la hauteur maximale de l’élément n’est pas limitée et la propriété max-height est considérée comme égale à 0 % . Pour plus d’informations sur les blocs conteneurs et sur le mode de calcul de leur hauteur, voir la spécification Cascading Style Sheets (CSS), Level 2 (CSS2), Revision 1 (CSS2.1) (Feuilles de style en cascade (CSS), Niveau 2 (CSS2), Révision 1 (CSS2.1)) |
La propriété n’a pas de valeur par défaut. La propriété de la feuille de style en cascade n’est pas héritée.
Remarques
Les attributs min-height et max-height s’appliquent aux éléments de niveau de bloc à positionnement flottant et absolu, aux éléments de bloc intraligne et à certains contrôles intrinsèques. Ils ne s’appliquent pas aux éléments inclus non remplacés, comme les colonnes de tableau et les groupes de lignes/colonnes. (Un élément « remplacé » possède des dimensions intrinsèques, comme un élément img ou un élément textarea .)
Cette propriété est activée uniquement sous la balise !DOCTYPE stricte.
Exemple
L’exemple suivant indique comment les attributs min-height et max-height affectent la disposition d’un élément DIV :
<!DOCTYPE html PUBLIC "-//W3C//Dtd XHTML 1.0 Strict//EN">
<html>
<head><style>
.height {
float:left;
width:300px;
background:#fff;
margin:0 1em;
}
#example1 {min-height:200px;}
#example2 {max-height:100px;}
.content {
border :1px solid #c00;
padding:5px;
}
</style>
</head>
<body>
<div class="height" id="example1">
<div class="content">
<h2>{min-height:200px }</h2>
<p>The height of this div is always at least 200px.<br/><br/>
The content does not fill the entire div.</p>
</div>
</div>
<div class="height" id="example2">
<div class="content">
<h2>{max-height:100px}</h2>
<p>This div will not grow more than 100px in height.<br/><br/>
The content that does not fit in the div continues beyond it.</p>
</div>
</div>
</body>
</html>
Informations relatives aux normes
Cette propriété est définie dans Cascading Style Sheets (CSS), Level 2 (CSS2) (Feuilles de style en cascade (CSS), Niveau 2 (CSS2)) .png "Ee371262.xtlink_newWindow(fr-fr,Expression.40).png")
.
Applicable à
a, abbr, acronym, b, bdo, big, blockquote, body, button, caption, center, cite, code, custom, dd, defaults, del, dfn, div, dl, dt, em, embed, fieldset, font, form, frameset, frame, hn, i, iframe, img, input type=button, input type=checkbox, input type=file, input type=image, input type=password, input type=radio, input type=reset, input type=submit, input type=text, ins, li, object, ol, p, q, s, span, sub, table, td, th, tt, u, ul, var, xmp