Height
Declaring element height
It is rarely needed to specify the height of an element in an interface when building responsive layouts,
but in some cases this can become useful. Often the height property depends on the parent’s
container properties, so this has to be taken into consideration.
Utilities
| Size | height | min-height | max-height |
|---|---|---|---|
| 100% | h100p | minh100p | maxh100p |
| 100vh | h100vh | minh100vh | maxh100vh |
| max-content | hmaxc |
Examples:
h100p
This will only work if the parent container height is specified.
minh100p
This works even though the parent's container height is not specified.
hmaxc
The height of this is based on the maximum height the content needs without overflowing, and the size is determined by assuming that there is infinite available space.