Set the minimum height of an element.
Syntax
min-height: length | percentage | none | inherit ;
Length - The min height in px, pt or em.
percentage - The min height as a percentage value.
none - No limit on the height. (default)
inherit - inherit from the parent element.
min-content - The intrinsic minimum width. Experimental/CSS 3.
(Firefox moz-min-content and Chrome webkit-min-content).
max-content - The intrinsic preferred width. Experimental/CSS 3.
(Firefox moz-max-content and Chrome webkit-max-content).
fill-available - The containing block height minus horizontal margin, border and padding. Experimental /CSS 3
available - An ancient name for fill-available (some browsers only)
Min-height does not include padding, borders, or margins, these can cause the total height to be larger.
If a
div contains more text than will fit within a limited height, then it will scroll below the bottom border.
Examples:
h1 { min-height: 25px; }
.emw3class { min-height: 2em; }
#emw3id { min-height: 25pt; }
Try it:
“If future generations are to remember us with gratitude rather than contempt, we must leave them more than the miracles of technology. We must leave them a glimpse of the world as it was in the beginning, not just after we got through with it” ~ President Lyndon B. Johnson |
(CSS 2) Browser Support: All major browsers.
“Happiness makes up in height what it lacks in length” ~ Robert Frost
Related:
max-height - Maximum height of an element.
height - Height of an element.
width - Width of an element.
box-sizing - The CSS box model used to calculate the height and width of elements.