YouTip LogoYouTip

Home > CSS > Pr Dim Min Height

Pr Dim Min Height

📅 2026-06-13 | 📂 CSS
```html\n\nCSS Min-height Property | Rookie Tutorial\n\nvar _hmt = _hmt || [];\n(function() {\n var hm = document.createElement("script");\n hm.src = "https://hm.baidu.com/hm.js?3b8ca71faa06d99ae4a8e6d108c0899b";\n var s = document.getElementsByTagName("script");\n s.parentNode.insertBefore(hm, s);\n})();\n\n\n\n
\n \n\n
\n\n
\n

\n CSS min-height Property\n

\n\n
\n

Instance

\n

Set the minimum height of a paragraph:

\n
\n

Instance

\n
\n
\n
p {\n  min-height: 150px;\n}
\n
\n
\n

\n Try It Yourself »\n

\n\n
\n

Definition and Usage

\n

min-height property sets the minimum height of an element.

\n

Note: The min-height property does not include padding, borders, or margins!

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
Default value:none
Inherited:no
Animatable:yes, see individual properties. Read about animatable
Version:CSS2
JavaScript syntax:object.style.minHeight="100px" Try it »
\n\n
\n

Browser Support

\n

The numbers in the table specify the first browser version that fully supports the property.

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
PropertyChrome ChromeEdge EdgeFirefox FirefoxSafari SafariOpera Opera
min-height1.07.03.02.0.27.0
\n\n
\n

CSS Syntax

\n
\n
min-height: length|initial|inherit;
\n
\n\n
\n

Property Values

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
ValueDescription
lengthDefines the minimum height in px, cm, etc. Default is 0. See length unitsTry it
%Defines the minimum height as a percentage of the containing blockTry it
initialSets this property to its default value. Read about initialTry it
inheritInherits this property from its parent element. Read about inherit
\n\n
\n

More Instances

\n
\n

Instance

\n

This example demonstrates how to use a pixel value to set the minimum height of an element.

\n
\n
\n
p {\n  min-height: 50px;\n}
\n
\n

\n Try It Yourself »\n

\n
\n\n
\n

Instance

\n

This example demonstrates how to use a percentage value to set the minimum height of an element.

\n
\n
\n
p {\n  min-height: 10%;\n}
\n
\n

\n Try It Yourself »\n

\n
\n\n
\n

Instance

\n

Set the minimum height to initial.

\n
\n
\n
p {\n  min-height: initial;\n}
\n
\n

\n Try It Yourself »\n

\n
\n\n
\n

Related Pages

\n

CSS tutorial: CSS Height and Width

\n

CSS reference: max-height property

\n

CSS reference: height property

\n\n
\n
\n\n
\n
\n\n\n\nvar _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");\ndocument.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3F3b8ca71faa06d99ae4a8e6d108c0899b' type='text/javascript'%3E%3C/script%3E"));\n\n$(".search-txt").focus(function(){\n $(this).attr("value", "");\n});\n$(".search-txt").blur(function(){\n if($(this).val()==""){\n $(this).attr("value", 'Enter your search keywords...');\n }\n});\n$(".search-txt").keyup(function(event){\n var keycode = event.keyCode;\n if(keycode == 13){\n var keywords = $(this).val();\n if(keywords != '' && keywords != 'Enter your search keywords...'){\n window.open(" "+keywords);\n }\n }\n});\n\n```
← Pr Dim Min WidthPr Dim Max Width →

📂 Categories