Høyde - CSS-triks

Anonim

Den heighteiendom i CSS Definerer spesifiserer innholdet høyde på bokser og aksepterer noen av lengdeverdier.

Innholdsområdet er definert som polstring og kant i tillegg til høyden / bredden eller størrelsen selve innholdet tar opp.

Negative verdier som height: -100pxaksepteres ikke. Den heightegenskap gjelder ikke for ikke-erstattet inline elementer inkludert bord kolonner og kolonnegrupper.

.wrap ( height: auto; /* auto keyword */ height: 120px; /* length values */ height: 10em; height: 0; /* unit-less length is OK for zero */ height: 75%; /* percentage value */ height: inherit; /* inherited value from parent element */ )
Sjekk ut denne pennen!

Hvis høyden på den inneholder blokken ikke spesifiseres eksplisitt, og elementet ikke er absolutt plassert, beregnes verdien av høyden til auto (den vil være så høy som innholdet i den, eller null hvis det ikke er noe innhold). Hvis elementets innholdsdel krever mer loddrett plass enn tilgjengelig fra den tildelte verdien, defineres elementets atferd av overflowegenskapen.

Når du bruker nøkkelordet auto, heightberegnes det basert på elementets innholdsområde med mindre det er spesifikt spesifisert. Dette betyr at en verdi basert på en prosentandel fremdeles er den for elementets innholdsområde. På samme måte, hvis høyden på beholderen er satt til en prosentverdi, er en underordnet elementhøyde fortsatt basert på innholdsområdet til det underordnede elementet.

Høyde kan også brukes som en animasjonsegenskap.

Nettleserstøtte

DVS Kant Firefox Chrome Safari Opera
Alle Alle Alle Alle Alle Alle
Android Chrome Android Firefox Android-nettleser iOS Safari Opera Mobile
Alle Alle Alle Alle Alle
Kilde: caniuse

Relaterte egenskaper

Almanakk 15. januar 2021

maks-høyde

.element ( max-height: 3rem; ) Sara Cope