Max-height
CSS vlastnost max-height určuje maximální výšku prvku.
| hodnoty | výška prvku |
|---|---|
| délka | nastavená výška nebo menší |
| procento | procento z výšky nadřazeného prvku (tagu), nebo menší |
| none | maximální výška není omezena |
Výška prvků je buďto jejich přirozená výška, nebo výška určená CSS vlastností height. Vlastnost max-height přináší další způsob, jak výšku prvku předepsat. Uplatní se to zejména v případech, kdy předem není znám obsah prvku nebo výška závisí procentuálně na velikosti okna.
Pokud jsou zadány jak max-height, tak height a jsou v konfliktu, pak max-height přebije height.
CSS vlastnost max-height se zatím nedá moc používat, protože ji nepodporuje Internet Explorer.
Podpora
| Prohlížeč | Podpora ve verzích | Poznámka |
|---|---|---|
|
Internet Explorer 6 a starší |
ne | někdy lze simulovat pomocí Expression() |
| Internet Explorer 7, 8, 9 | ano, pouze ve standardním módu | |
| Mozilla (Firefox, Netscape 6+ atd.) | ano, všechny verze | |
| Opera | 7, 8, 9 | |
| Konqueror | asi ano | |
| IE 5 / Mac | nevím, asi ne | |
| Netscape Navigator 4 | ne |
Příklady
Následující příklad je zastaralý.
Jak nasimulovat max-height pro všechny prohlížeče? Problém je Explorer, ale v něm funguje konstrukce expression. Takže takhle:
#prvek {
max-height: 400px;
_height: expression(this.scrollHeight > 400? "400px" : "auto" );
overflow :hidden;}
To overflow: hidden způsobí useknutí toho, co přesahuje. Konstrukce funguje tak, že se prvek v exploreru podívá na svou vlastní výšku a pokud je větší než 400, tak se osekne na 400. Možná vidíte podtržítkový hack pro Explorer.
Reklama
