widows
Quick Summary for widows
The widows CSS property sets the minimum number of lines in a block container that must be shown at the top of a page, region, or column.
Code Usage for widows
/* <integer> values */ widows: 2; widows: 3;  /* Global values */ widows: inherit; widows: initial; widows: revert; widows: unset; 
More Details for widows

widows

The widows CSS property sets the minimum number of lines in a block container that must be shown at the top of a page, region, or column.

/* <integer> values */ widows: 2; widows: 3;  /* Global values */ widows: inherit; widows: initial; widows: revert; widows: unset; 

In typography, a widow is the last line of a paragraph that appears alone at the top of a page. (The paragraph is continued from a prior page.)

Syntax

Values

<integer>

The minimum number of lines that can stay by themselves at the top of a new fragment after a fragmentation break. The value must be positive.

Formal definition

Initial value2
Applies toblock container elements
Inheritedyes
Computed valueas specified
Animation typediscrete

Formal syntax

<integer>

Examples

Controlling column widows

HTML
<div>   <p>This is the first paragraph containing some text.</p>   <p>This is the second paragraph containing some more text than the first one. It is used to demonstrate how widows work.</p>   <p>This is the third paragraph. It has a little bit more text than the first one.</p> </div> 
CSS
div {   background-color: #8cffa0;   columns: 3;   widows: 2; }  p {   background-color: #8ca0ff; }  p:first-child {   margin-top: 0; } 
Result

Specifications

Specification
CSS Fragmentation Module Level 3 # widows-orphans
CSS Multi-column Layout Module Level 2 # filling-columns

See also

orphans Paged media

Last modified: Oct 3, 2021, by MDN contributors

Select your preferred language English (US)DeutschEspañolFrançais日本語Русский中文 (简体) Change language

No Items Found.

Add Comment
Type in a Nick Name here
 
Other Categories in CSS
css
Search CSS
Search CSS by entering your search text above.
Welcome

This is my test area for webdev. I keep a collection of code here, mostly for my reference. Also if i find a good link, i usually add it here and then forget about it. more...

You could also follow me on twitter. I have a couple of youtube channels if you want to see some video related content. RuneScape 3, Minecraft and also a coding channel here Web Dev.

If you found something useful or like my work, you can buy me a coffee here. Mmm Coffee. ☕

❤️👩‍💻🎮

🪦 2000 - 16 Oct 2022 - Boots
Random Quote
In this case my anchor this week becomes driving almost 2hrs outside of Atlanta to one of my favorite hard core gyms in the world.. MetroFlex aka The Dungeon. The gym owners turn the heat way up so it becomes a fun sweat box and the gym members just watch from afar and leave me alone. I happily drive myself long distances to find MY ANCHOR. Our anchor allows us to have balance, focus and be as productive as possible. And if you're in the middle of a heavy set and your headphones start to fall off your head, like mine did here.. well.. f*ck the headphones. Let em break and fall. You can always get a new pair, but the iron ain't ever gonna lift itself.
Unknown
Random CSS Property

text-rendering

The text-rendering CSS property provides information to the rendering engine about what to optimize for when rendering text.
text-rendering css reference