max-height

Description

max-height sets a maximum constraint on the height of the element.

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

Syntax and Property Values


max-height: length | percentage | inherit 

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

Example


<!DOCTYPE HTML>
<html>
     <head>
         <style>
  p {<!--from w  w  w.ja va2  s. com-->
      padding: 10px;
      margin: 10px;
      border:  1px solid black;
      background: lightgray;
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      max-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. 
             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

The code above generates the following result.

max-height




















Home »
  HTML CSS »
    HTML CSS Reference »




HTML Tag Reference
CSS Reference
CSS Selector Reference
Encoding Reference