CSS page orientation

I have a purpose for creating a print view using HTML and CSS. Then this representation is analyzed and transferred to PDF on the server. The document is then presented to users and wound around the A5 printer.

one of the requirements is the orientation of the first page as Landscape and the orientation of all other pages as Portrait

I created a view and a servlet that parses HTML and CSS to create PDF using Flying Saucer . However, I am having some problems with Page Orientation. I use the following CSS to control page layout

@page :first {size: A5 landscape} @page{ size: A5 } 

I get the correct layout for the first page. All other pages are displayed as landscape A3 (the border of the text printed) printed on A4 paper (actual page orientation).

Any idea what I'm doing wrong here

+4
source share
1 answer

The orientation was correct, but the width of the A5 size did not take into account the margins, so the text moved along the expected page width. Work on creating a new CSS class, I called the portfolio of the class, which set the width and height of the page as follows:

 .portrait{ padding:5px; margin:15px 0px; width:5.5in ; font: 11px verdana, sans-serif; } 

Hope this helps anyone facing a similar issue. I would also be wondering if anyone has an analysis why size: A5 is not working properly

+3
source

Source: https://habr.com/ru/post/1396328/


All Articles