Orphan html elements

Hi,
I have a dynamic document which has some subheadings and variable length content below. In some cases, I get a heading placed at the end of one page, while the content starts in the next one. I tried to use `orphans` property, but during my tests I found it only works within the same tag.

So, how can I achieve this?

This is a small example to reproduce it, based on your annotated example. The desired effect would move "Title" to a new page, if there's no room for "Line 1" as well in the same page.

```html
.no-orphans {
widows: 0;
orphans: 2;
}

NOTE: This is a small repro based on the example, but the real scenario replaces all the `

`'s content with `