Set div height to 100% of the page height → using `vh` and `vw` in pagedjs
I want to set the div
height to 100% of the page: test.html
Unfortunately, the content is wrapped inside a div
element that prevents the height: 100%
to be propagated.
<div class="pagedjs_page_content" style="column-width: 624px; column-gap: calc(var(--pagedjs-margin-right) + var(--pagedjs-margin-left));">
<div>
<div id="cover" class="title-page" data-ref="6ee6fe4e-2a0a-44fe-9a60-f94b8ffff461" data-id="cover" data-break-after="page">
<h1 data-ref="71a620ad-85e3-478c-acb4-a18f58ae3068">Title</h1>
</div>
</div>
</div>
In Paged.js 0.1.34, I was using an height of 100vh
. It worked but I believe it's invalid because the viewport size is different from the page size.
Now I get the following warning and my title is absent from the output:
overflow on page-1 JSHandle@object
Please note that the title is visible when I open the page in the browser but absent when I'm using an automated process (ie. Puppeteer in headless mode)
Am I missing something? Is there another way to do this?
Thanks!