I'm new to web programming. so basically I created a printable document and I want an element like a company's stamp to be on the bottom right corner of the last page. However when I used "position: absolute;", the element only appeared on the first page
@media print{
#non-printable {
display: none;
}
#printable {
display: block;
}
html, body{
height: 99%;
}
}
.stamp {
position: absolute;
right: 0;
bottom: 0;
}
@page {
size: A4;
margin: 40px;
}<body>
<div id="non-printable">
<button onclick="print()">Print</button>
</div>
<div id="printable">
<h1>Hello World</h1>
<div style="break-after:page;"></div>
<h1>This is the 2nd page</h1>
<div style="break-after:page;"></div>
<h1>I want the element on this page</h1>
<div class="stamp">
<h4>BUT IT IS HERE</h4>
</div>
</div>