Display element with named page on same page as content before

I would like to display a custom header if the element with class `.box` is on the current page. When I set the page CSS-attribute to `.box`, then it will be always placed on a new page, but I want it on the old page, if enough space is available. I didn't set `page-break-before: always;`. Is this a bug or should I go another way?

```html

@page defined-page {
@top-center {
content: 'This page was defined';
}
}
/*the box should display on the same page as the content before, if enough space is available*/
.box {
page-break-inside: avoid;
page: defined-page;
width: 100mm;
height: 100mm;
background-color: red;
}

Content before
Content before
Content before
Content before

```
Reproducable on online sandbox