I've to print out 2 html pages in a web-app. The first page must be printed out in A5 size , the second in A4 size. I tried to force the a5 print settings with
@media print{
@page {
size: a5 landscape;
margin: 0;
}
}
and the a4 print settings in the other file with
@media print {
@page {
size: a4;
margin: 0;
}
}
A4 is working fine, but if I try to print the A5 page , paper-size doesn't change (but landscape mode is set)
Step 1: Click the three dots on the upper right corner of your Google Chrome browser to expand the More Options list. Step 2: Select Print. Step 3: Click on More Settings. Step 4: Select the correct paper size from the dropdown.
You could uset paper-css library as it will help you easily define the paper size by paper-css lib load the css file
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/paper-css/0.3.0/paper.css">
then set the style in the <head>
part
<style>@page { size: A5 }</style>
then set the body class to A5
like the following
<!-- Set "A5", "A4" or "A3" for class name -->
<!-- Set also "landscape" if you need -->
<body class="A5">
<!-- Each sheet element should have the class "sheet" -->
<!-- "padding-**mm" is optional: you can set 10, 15, 20 or 25 -->
<section class="sheet padding-10mm">
<!-- Write HTML just like a web page -->
<article>This is an A5 document.</article>
</section>
</body>
for more information follow the link below https://github.com/cognitom/paper-css
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With