Egenskaben min-height
Egenskaben min-height angiver
minimumshøjden for et element. Værdien for egenskaben
er enhver enhed
for størrelser eller nøgleordet none,
hvilket betyder fravær af værdi.
Normalt angives det for et element med flydende bredde (højden er angivet i procenter eller slet ikke angivet, og elementets højde tilpasses af dets indhold).
Hvis der er angivet en minimumshøjde - kan elementet ikke
blive lavere end denne højde. Hvis
der er mindre tekst end nødvendigt for min-height,
vil elementet have højden min-height.
Hvis der derimod er mere tekst - vil elementets højde blive beregnet afhængigt af mængden af tekst.
Syntaks
selektor {
min-height: værdi;
}
Eksempel
I dette eksempel er højden slet ikke angivet
og vil blive beregnet af browseren automatisk
afhængigt af mængden af tekst. Men,
da egenskaben min-height er angivet,
vil højden ikke blive mindre end denne værdi,
selvom der slet ikke er tekst i den:
<div id="elem">
Lorem ipsum dolor sit amet.
</div>
#elem {
min-height: 100px;
width: 300px;
border: 1px solid black;
}
:
Eksempel
Lad os tilføje elementet mere tekst - så der opstår overløb af blokken i højden. I dette tilfælde vil vores blok blot øge sin højde:
<div id="elem">
some long text
</div>
#elem {
min-height: 100px;
width: 300px;
border: 1px solid black;
text-align: justify;
}
:
Eksempel
Til sammenligning, lad os se, hvad der vil ske
med blokken, hvis vi fjerner minimumshøjden
og i stedet angiver egenskaben height:
<div id="elem">
some long text
</div>
#elem {
height: 100px;
width: 300px;
border: 1px solid black;
text-align: justify;
margin-bottom: 50px;
}
:
Se også
-
egenskaben
max-height,
som angiver maksimal højde af et element -
egenskaben
max-width,
som angiver maksimal bredde af et element -
egenskaben
min-width,
som angiver minimum bredde af et element