CSS orphans PropertyS2C Home « CSS orphans Property

Definition

The CSS orphans property allows us to specify the minimum number of lines to display at the bottom of a page, when a page break occurs inside a block-level element.

Applies To

All block-level elements.

Property Values

negative values are NOT acceptable when using the CSS orphans property.

inherit - Orphan attributes are inherited from the parent element.

integer - Defines the number of lines of a block container that must be left at the bottom of the current printable page.

Default Value

Default value is set to 2.

Inheritance

The orphans properties are inherited from the parent element if none are applied to the current element.

Browser Anomalies

Only IE8 and above and Opera support the CSS orphans property.
IE5, IE6 and IE7 do not support the inherit property value.
IE8 does with a valid !DOCTYPE.
IE9+ supports the inherit property value.

Example



<!DOCTYPE html> 
<!-- Our HTML/CSS for the CSS orphans property follows -->
<html  lang="en">
<head>
<title>CSS Reference - CSS orphans Property</title>

<!-- Valid values for CSS orphans Property are:
	
	inherit and integer. 
	
--> 

<style type="text/css">

/* Deal with paragraph orphans */
p {
  orphans; 5;
}

</style>
</head>

<body>
<h1>The orphans CSS property</h1>
<p>Some text you need to repeat if you wanna test this property</p>
</body>

</html>

go to home page Homepage go to top of page Top