CSS Property min-height








min-height sets a minimum constraint on the height of the element.

Summary

ItemValue
Initial value 0
Inherited No.
Version CSS2
JavaScript syntax object.style.minHeight="10px"
Applies to All elements except inline nonreplaced elements and table elements.




CSS Syntax

min-height: length | percentage | inherit

Property Values

The property values are listed in the following table.

ValueDescription
auto Default value. The browser does the calculation.
length Set width in px, cm, etc.
% Set width in percent of the containing element
inherit Inherit the width property from the parent element

Browser compatibility

min-height Yes Yes Yes Yes Yes




Example

An example showing how to use min-height CSS property.

<!DOCTYPE HTML>
<html>
     <head>
         <style>
  p {<!--from  w w w. j  av a2 s  . co  m-->
      padding: 10px;
      margin: 10px;
      border:  1px solid black;
      background: red;
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      min-height: 200px;
  }
         </style>
     </head>
     <body>
     <p>
     this is a test. this is a test. 
     this is a test. this is a test. 
     this is a test. this is a test. 
     this is a test. this is a test. 
     </p>
     </body>
 </html>

Click to view the demo