HTML - DOM Style Object minHeight Property

Quiz

HTML DOM Style Object minHeight property sets or returns the minimum height of an element. It only affects block-level elements or elements with fixed or absolute positioning.

Syntax

Set the minHeight property:

object.style.minHeight= "length | percentage | initial | inherit";

Get the minHeight property:

object.style.minHeight;

Property Values

Value	Description
length	It specifies minimum height of element in length units.
percentage	It specifies minimum height in percentage of the parent element
initial	It is used to set this property to it's default value.
inherit	It is used to inherit the property of it's parent element.

Return Value

It returns a string value which represents min height of an element.

Example of HTML DOM Style Object 'minHeight' Property

The following example sets minimum height of div element to 400px.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM Style Object minHeight Property
    </title>
    <style>
        #margin {
            border: 2px solid #04af2f;
            overflow: auto;
            width: 400px;
        }
    </style>
</head>
<body>
    <h3>
        Click to set minimum height.
    </h3>
    <button onclick="fun()">Set min Height</button>
    <br>
    <div id="margin">
        <p>
            CSS is the acronym for "Cascading 
            Style Sheet". It's a style sheet 
            language used for describing the 
            presentation of a document written 
            in a markup language like HTML. 
        </p>
        <p>
            CSS helps the web developers to 
            control the layout and other visual 
            aspects of the web pages. CSS plays 
            a crucial role in modern web development 
            by providing the tools necessary to 
            create visually appealing, accessible,
            and responsive websites.
        </p>
    </div>
    <script>
        function fun() {
            document.getElementById("margin")
                .style.minHeight = "400px";
        }
    </script>
</body>
</html>

Supported Browsers

Property
minHeight	Yes 1	Yes 12	Yes 3	Yes 1.3	Yes 4

html_dom.htm

Print Page