WIDOWS

The widows property specifies the minimum number of line boxes in a block container that must be left in a fragment after a break.

SYNTAX

CSS


            widows: value;

JS


            object.style.widows = "value";

VALUES


            <'widows'> = <integer>


            <integer>

Specifies one or more decimal digits (0-9).

INITIAL

EXAMPLES

INTEGER

<!doctype html>
<html>
<head>
    <style>
        div {
            columns: 3;
            widows: 4;
        }
        p:nth-of-type(2) {
            background-color: yellow;
        }
    </style>
</head>
<body>
    <div>
        <p>integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer</p>
        <p>integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer</p>
        <p>integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer</p>
        <p>integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer</p>
        <p>integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer integer</p>
    </div>
</body>
</html>

JS

<!doctype html>
<html>
<head>
    <style>
        div {
            columns: 3;
        }
        p:nth-of-type(2) {
            background-color: yellow;
        }
    </style>
    <script>
        function mouseover(value) {
            document.getElementsByTagName("div")[0].style.widows = value;
        }
    </script>
</head>
<body>
    <input onmouseover="mouseover(value)" type="button" value="initial">
    <button onmouseover="mouseover(value)" value="4">integer</button>
    <div>
        <p>widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows</p>
        <p>widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows</p>
        <p>widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows</p>
        <p>widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows</p>
        <p>widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows widows</p>
    </div>
</body>
</html>

WIDOWS

SYNTAX

CSS

JS

VALUES

INITIAL

EXAMPLES

INTEGER

JS

LINKS

INTERNAL

EXTERNAL