Demo: CSS orphans

<div class='text-container'><p>This is a sample paragraph demonstrating the orphans property in CSS. It is designed to show how the text behaves when there are not enough lines to satisfy the orphans requirement. You should see that at least two lines are kept together at the bottom of this block.</p><p>Here is another line to ensure we have enough text to demonstrate the effect of orphans correctly.</p></div>

.text-container { width: 300px; margin: 20px; font-family: Arial, sans-serif; font-size: 16px; line-height: 1.5; orphans: 2; }

// No JavaScript required for this demo

This is a sample paragraph demonstrating the orphans property in CSS. It is designed to show how the text behaves when there are not enough lines to satisfy the orphans requirement. You should see that at least two lines are kept together at the bottom of this block.

Here is another line to ensure we have enough text to demonstrate the effect of orphans correctly.