This example demonstrates how to set a minimum height and a maximum height of an element using a pixel value.
| HTML file: | Displayed by browser: |
|---|---|
|
<style>
p { max-height: 200px; min-height: 100px; background-color: yellow; } </style> <body> <p>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</p> </body> |
This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. |
The paragraph is displayed at a minimum of 100 pixels high. If you resize the browser's window to where the element (colored in yellow) reaches the 200 pixel high mark, a scroll bar will appear on the side. The element container will not get any taller (although the contents may spill out of the container).
