Skip to content
Related Articles

Related Articles

Improve Article

HTML | DOM Style widows Property

  • Last Updated : 30 Nov, 2019

The widows property is used to set or return the minimum number of lines. These lines must be visible at the top of a page for an element. The widows property only affects block-level elements.


  • Return the widows property:
  • Set the widows property: = "number | initial | inherit" 

Property Values:

  • number: Integer value that specify the minimum number of visible lines. The default value is 2.
  • initial: Sets this property to its default value.
  • inherit: Inherits this property from its parent element.


        function CWidows() {
              = document.getElementById("widows").value;
        .content {
            width: 400px;
            border-top: 19cm solid green;
        @page {
            /* set size of printed page */
            size: 21cm 27cm;
            margin-top: 2cm;
        @media print {
            .widows {
                widows: 2;
        <div class="content">
            <input id="widows" value="2">
            <button onclick="CWidows();">Change widows</button>
            <p style="font-size:120%" id="pID">
                Change widows and see the print preview.
                <br> Line 2
                <br> Line 3
                <br> Line 4
                <br> Line 5
                <br> Line 6
                <br> Line 7
                <br> Line 8
        <div class="content">

Output: Print view.

Supported Browsers: The browsers supported by HTML DOM Style widows Property are listed below:

  • Google Chrome
  • Opera

Attention reader! Don’t stop learning now. Get hold of all the important Comcompetitivepetitve Programming concepts with the Web Design for Beginners | HTML  course.

My Personal Notes arrow_drop_up
Recommended Articles
Page :