`height: 100%` on element can cause elements to go missing
Given
<!DOCTYPE html>
<html>
<head>
<title>test</title>
<script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script>
<style>
html body p {
margin-top: 0; /* this is needed */
}
.content {
height: 100%; /* this is needed */
}
</style>
</head>
<body>
<div class="content">
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>0</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>0</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>0</p>
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>0</p>
<p>Not visible</p>
</div>
<div></div> <!-- this is also needed! -->
</body>
</html>
The result is test.pdf in Chrome and Edge (Firefox behaves normally). I can work around the issue for myself, but figured I would share the MVE now that I have it anyway.