HTML - DOM Style Object pageBreakInside Property

Quiz

HTML DOM Style Object pageBreakInside property sets or returns page break behavior inside an element during print or print preview.

Syntax

Set the pageBreakInside property:

object.style.pageBreakInside= "auto | avoid | initial | inherit";

Get the pageBreakInside property:

object.style.pageBreakInside;

Property Values

Value	Description
auto	It is the default value which inserts a page break inside element if required.
avoid	It avoids the page break inside an 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 page break behavior inside an element while printing.

Example of HTML DOM Style Object 'pageBreakInside' Property

The following example avoids page break inside p element with id result.

<!DOCTYPE html>
<html>
<head>
    <title>
        HTML DOM Style Object pageBreakInside Property
    </title>
</head>
<body>    
    <h3>
        You need to save this code in 
        your system to see changes
    </h3>
    <p>
        Click to see effects in print 
        or print preview option.
    </p>
    <button onclick="fun()">Click</button>
    <p>Welcome to Tutorials Point.</p>
    <p id="result">
        No page break inside this paragraph.
    </p>   
    <script>
        function fun() {
            document.getElementById("result")
                .style.pageBreakInside = "avoid";
        }
    </script>
</body>
</html>

Supported Browsers

Property
pageBreakInside	Yes 1	Yes 12	Yes 19	Yes 1.3	Yes 7

html_dom.htm

Print Page