Höjd - CSS-tricks | CSS Almanack 2025

Den heightegendom i CSS Definierar specificeras innehållet höjd av lådor och accepterar någon av längdvärden.

Innehållsområdet definieras som vaddering och kant utöver den höjd / bredd eller storlek själva innehållet tar upp.

Negativa värden som height: -100pxaccepteras inte. Den heightegenskapen gäller inte för icke-ersatt inline element inklusive tabellkolumner och kolumngrupper.

.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 */ )

Kolla in den här pennan!

Om höjden på det innehållande blocket inte anges specifikt och elementet inte är absolut placerat beräknas värdet på dess höjd till auto (det blir så högt som innehållet i det eller noll om det inte finns något innehåll). Om elementets innehållsdel kräver mer vertikalt utrymme än tillgängligt från det tilldelade värdet definieras elementbeteendet av overflowegenskapen.

Vid användning av sökord auto, heightberäknas baserat på elementen innehållsområdet inte uttryckligen anges. Detta betyder att ett värde baserat på en procentsats fortfarande är det för elementets innehållsområde. På samma sätt, om behållarens höjd är inställd på ett procentvärde, baseras en underordnad procentandel höjd fortfarande på innehållsområdet för det underordnade elementet.

Höjd kan också användas som en animerbar egenskap.