Orphans

We can use the orphans CSS property to control the minimum number of lines that must be left at the bottom of a page or column before a break occurs, helping to improve the readability of text in printed documents or multi-column layouts.

Change the number of columns and orphans to see how the text behaves.

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, quos.

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, quos. Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, quos.

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, quos. Lorem ipsum dolor sit amet consectetur adipisicing elit. Quisquam, quos.

  • Option 1
  • Option 2
  • Option 3
  • Option 4
  • Option 5
  • Option 6
  • Option 7
div.content {
    columns: 4;
    orphans: 2;
}