Page-Break-Before

page-break-before Support Key: [*CSS2\|CSS2.1] [IE4\|N7\|O3.5\|S1.2*]	Other Printing Properties
	page-break-inside page-break-after page marks	size widows orphans
= Index DOT Css by Brian Wilson =

Main Index | Property Index | CSS Support History | Browser History

Quick Statistics
Default Value:		auto
Applicable Elements:		Block elements
Inherit From Parent:		No
Applicable Media:		Visual, Paged
HTML Equivalent:		NA
Official Docs:		CSS2: Sect. 13.3.1, CSS2.1: Sect 13.3.1 Microsoft MSDN Reference

What is it?

This property specifies the page-breaking behavior that should occur before an element box and on what side of the page the content that follows should resume on. Page breaks are not allowed in absolutely positioned elements.

CSS2 "suggests" when page-breaking should occur:

Page-breaking should occur as few times as possible.
Page-breaking should be avoided inside these elements: tables, floated elements and block elements with borders.
Pages that are not forced to break should have approximately the same height.

Allowed Values
inherit
[CSS2|CSS2.1] [S1.2]: Type: Explicit; Description:
Explicitly sets the value of this property to that of the parent.
auto
[CSS2|CSS2.1] [IE4|N7|O3.5|S1.2]: Type: Explicit; Description:
Insert a page break before the element as necessary.
avoid
[CSS2|CSS2.1] [O3.5]: Type: Explicit; Description:
Avoid inserting a page break before the current element box.
left|right
[CSS2|CSS2.1] [IE4|O3.5]: Type: Explicit; Description:
left: Force one or two page breaks before the current element box until a blank left page is reached.
right: Force one or two page breaks before the current element box until a blank right page is reached.
always
[CSS2|CSS2.1] [IE4|N7|O3.5|S1.2]: Type: Explicit; Description:
Always force a page break before the current element box.
[empty string]
[IE5]: Type: Explicit; Description:
No property value is used in this case. A page break is not inserted before the current element box.

Example: Ext/Doc: p { page-break-before: always }; In-Line: <p STYLE="page-break-before: always">test text in the paragraph</p>

Notes

Before its inclusion in CSS2, this property was first proposed in the W3C Working Draft "CSS Printing Extensions" (6/26/97, http://www.w3.org/TR/WD-print)

Browser Peculiarities

Internet Explorer reference: "If there are conflicts between this property and the page-break-after value on the following [element box], the value that results in the largest number of page breaks will be used."
The IE 4.0 reference material listed support for "auto", "left" and "right" values. The IE 5.0 reference material only listed "always" and "" (empty string) as valid, but now it says that "auto", "left" and "right" ARE supported.
IE's documentation says that values of "left" and "right" are treated like "always."
Internet Explorer 4.0: This property has no effect on the BR element. It does in IE 5.0.
I discovered a crashing bug when testing "inherit" with printing properties in Opera (tested in 5.x, 6.x and 7.x):
Scenario - Load this code and switch to print preview:
<div STYLE="page-break-before: always">text <div STYLE="page-break-before: inherit">text</div> text</div>
Be careful...
Although Netscape 7.x now supports this property in a limited fashion, looking at bugzilla it appears there are a few bugs (such as problems with breaking in tables and applying the property using CSS classes.)