CSS ORPHANS

Written by jon on 12:53 AM
This property specifies the minimum number of lines of content for the current element that must be left at the bottom of a page in a paged display environment.
Example
p { orphans: 4 }

<p style=”orphans: 4″>test text in the paragraph</p>

Possible Values
Value Description
inherit Explicitly sets the value of this property to that of the parent.
[integer] Specifies an integer value representing the minimum number of lines of content that must be left at the bottom of a page.

CSS WIDOWS

Written by jon on 12:52 AM
This property specifies the minimum number of lines of content for the current element that must be left at the top of a page in a paged display environment.

Example
p { widows: 1 }

<p style=”widows: 1″>test text in the paragraph</p>

Possible Values
Value Description
inherit Explicitly sets the value of this property to that of the parent.
[integer] Specifies an integer value representing the minimum number of lines of content that must be left at the top of a page.

CSS MARKS

Written by jon on 12:50 AM
Printed documents in the printing industry often carry marks on the page outside the content area. These marks are used to align and trim groups of papers.
This property specifies what sort of marks should be rendered just outside the rendered page box. The characteristics and position of the marks will be browser dependent.

Example
body { marks: crop cross }

<body style=”marks: crop cross”>test text in the body</body>

Possible Values
Value Description
inherit Explicitly sets the value of this property to that of the parent.
none No page marking will occur.
crop Specifies that crop marks be used to indicate where the page should be cut.
cross Specifies that cross-hair marks be rendered in order to precisely align the current page with other pages carrying ‘cross' marks.

CSS SIZE

Written by jon on 12:49 AM
This property describes the orientation or dimensions of the page box. The ’size’ property classifies a page box so that it is either ‘relative’ or ‘absolute’. ‘Absolute’ page boxes have a fixed size, whereas ‘relative’ page boxes will be scaled to fit the target paged media. In the case where a page box is smaller than the intended ’size’, CSS2 recommends that it be centered on the page to allow for better alignment of multiple pages.
Example
body { size: 8.5in 11in }

<body style=”size: 8.5in 11in”>test text in the body</body>

Possible Values
Value Description
inherit Explicitly sets the value of this property to that of the parent.
auto This value defines a ‘relative' page box, setting the values to the size and orientation of the target page.
portrait This value defines a ‘relative' page box, overriding the target page's current default content orientation, using the typical paradigm where content flows from left to right across the short dimension, and flowing down along the long dimension.
landscape This value defines a ‘relative' page box, overriding the target page's current default content orientation, using the landscape method, where content flows from left to right across the long dimension, and flowing down along the short dimension. This method is often used when a given line will contain larger amounts of content than normal.
[length] Giving length values for this property creates a page box with fixed dimensions, eg: an ‘absolute' page box. Setting only one length value with this value creates a square page box of equal height and width. If two values are specified, the first value represents the page width, and the second represents the page height.

CSS PAGE

Written by jon on 12:47 AM
This property is used to specify a specific page type to use when displaying an element box. If the value specified is different than the one for the rendered element box that precedes it, one or two page breaks should be inserted between them, and the element box should then be rendered on a page box of the indicated type.
Example
@page doublepage { size: 8.5in 11in; page-break-after: left }

body { page: doublepage; page-break-after: right }

<body style=”page: doublepage; page-break-after: right”>test text in the body</body>

Possible Values
Value Description
auto References the current default page.
[identifier] Specifies an identifier for a page type defined in an @page rule.

CSS PAGE-BREAK-AFTER

Written by jon on 12:45 AM
This property specifies the page-breaking behavior that should occur after 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.

Example
p { page-break-after: always }

<p style=”page-break-after: always”>Test text in the paragraph</p>

Possible Values
Value Description
inherit Explicitly sets the value of this property to that of the parent.
auto Insert a page break before the element as necessary.
avoid Avoid inserting a page break before the current element box.
leftright left: Force one or two page breaks after the current element box until a blank left page is reached.

right: Force one or two page breaks after the current element box until a blank right page is reached.

always Always force a page break before the current element box.
{empty string] No property value is used in this case. A page break is not inserted before the current element box.

CSS PAGE-BREAK-INSIDE

Written by jon on 12:44 AM
This property specifies the page-breaking behavior that should occur inside an element’s rendering box. Page breaks are not allowed in absolutely positioned elements.
Example
p { page-break-inside: auto }

<p style=”page-break-inside: auto”>Test text in the paragraph</p>

Possible Values
Value Description
inherit Explicitly sets the value of this property to that of the parent.
auto Insert page breaks inside the element box as necessary.
avoid Avoid inserting page breaks inside the current element box if possible.

CSS PAGE-BREAK-BEFORE

Written by jon on 7:20 AM
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.

Example
p { page-break-before: always }

<p style=”page-break-before: always”>Test text in the paragraph</p>

Possible Values
Value Description
inherit Explicitly sets the value of this property to that of the parent.
auto Insert a page break before the element as necessary.
avoid Avoid inserting a page break before the current element box.
leftright 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 Always force a page break before the current element box.
{empty string] No property value is used in this case. A page break is not inserted before the current element box.

RECENT COMMENTS

SUBSCRIBE TO CSS3 EXAMPLES

 Subscribe to css3 Examples via RSS
Or, subscribe via email:
Find CSS3 Examples Entries :