I have two simple questions. I want to print a page with these contents. The printing area for the first page is like this.
and for the second page
My first question is: As you see, the first page has a different distance from the top than the second page (and other pages). However, I don’t want this difference; I want the exact same distance.
And my second question is: Is there any way to show the print date and time only on the first page?
this is my css and js code
window.print();
@media print {
/* Hides the entire body content initially */
body {
margin: 0;
padding: 0;
visibility: hidden;
-webkit-print-color-adjust: exact; /* Ensure colors appear correctly when printing */
}
/* Shows only the specified element and keeps other elements hidden */
#ride-receipts {
visibility: visible; /* Makes it visible */
gap: 60px; /* Adds the specified gap */
width: 100%; /* Sets the full width */
}
#ride-receipts > div {
break-inside: avoid;
}
.drawer {
display: none;
}
}
@page {
size: auto;
margin-bottom: 0;
}