W3Schools.com

Style widows Property

Style Object Reference Style Object

Definition and Usage

The widows property sets or returns the minimum number of lines for an element that must be visible at the top of a page (for printing or print preview).

The widows property only affects block-level elements.

Tip: widows:5 means that at least 5 lines must be visible below the page break.

Tip: See the orphans property to set or return the minimum number of lines for an element that must be visible at the bottom of a page.

Syntax

Set the widows property:

Object.style.widows="number|inherit"

Return the widows property:

Object.style.widows

Value Description
number An integer that specifies the minimum number of visible lines. The default value is 2
inherit The value of the widows property is inherited from parent element

Browser Support

Internet Explorer Firefox Opera Google Chrome Safari

The widows property is only supported in Opera.

Example

Example

Change the widows and check print or print preview:

<html>
<head>
<script type="text/javascript">
function ChangeWidows()
{
document.getElementById("p1").style.widows=document.getElementById("widows").value;
}
</script>
<style>
.othercontent
{
width:400px;
border-top:19cm solid #c3c3c3;
}

@page
{
/* set size of printed page */
size:21cm 27cm;
margin-top:2cm;
}

@media print
{
.widows
{
widows:2;
}
}
</style>
</head>

<body>
<div class="othercontent" />
<input id="widows" value="2"/>
<button onclick="ChangeWidows();">Change widows</button>

<p style="font-size:120%" id="p1">
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<br />
</p>

<div class="othercontent" />

</body>
</html>

Try it yourself »

Style Object Reference Style Object
WEB HOSTING
Best Web Hosting
PHP MySQL Hosting
Best Hosting Coupons
UK Reseller Hosting
Cloud Hosting
Top Web Hosting
$3.98 Unlimited Hosting
Premium Website Design
WEB BUILDING
XML Editor - Free Trial!
FREE Website BUILDER
Best Website Templates Top CSS Templates
CREATE HTML Websites
EASY WEBSITE BUILDER
W3SCHOOLS EXAMS
Get Certified in:
HTML, CSS, JavaScript, XML, PHP, and ASP
W3SCHOOLS BOOKS
New Books:
HTML, CSS
JavaScript, and Ajax
STATISTICS
Browser Statistics
Browser OS
Browser Display
SHARE THIS PAGE