Log in / Register

Forum › How do I...?

Portrait and Landscape document not printing with correct orientation

Tjaart
We have a document with two pages.

The one page is portrait and the other is landscape.

When we print the document in Adobe the landscape page is printed as portrait.

When checking the "Choose paper source by PDF page size" checkbox manually the document prints correctly.

Is there a way to setup the landscape page correctly to get Adobe or any other printing software to print the landscape page correctly?

Please see example code below:

<style type="text/css">
@page {
    margin: 15px;
}

@page portrait {
    size: A4 portrait;
}

@page landscape {
    size: A4 landscape;
}

.portrait {
    page: portrait;
}

.landscape {
    page: landscape;
}
</style>

<div class="portrait">
    <img src="/Images/soren-astrup-jorgensen-333989.jpg" style="max-width:100%" />
</div>
<div class="landscape" style="page-break-before:always">
    <img src="/Images/sebastian-unrau-31677.jpg" style="max-width:100%" />
</div>
  1. A4 example.zip‎ 2.8 MB ‎
    example PDF, HTML and resources used
mikeday
Which Prince version are you using? You may wish to use "prince-rotate-body: landscape" instead of the size property.
Tjaart
We are using Prince 11.1

I will look into using the "prince-rotate-body: landscape" as suggested
jamsheer
We have a document or HTML string with multiple portraits and landscape pages to convert pdf with multiple pages.

When we convert it,the portrait pages come in one page, and landscape pages come in another page in a single pdf.

Actually, we need to get a pdf with the collection of portrait pages and landscape pages in a single pdf.

Please see example code below and I attached the HTML document here:

<html>
	
  <head>
    <style>
      @page portrait {
        size: a4 portrait;
      }

      @page landscape {
        size: a4 landscape;
      }

      div.portrait {
        page: portrait;
        margin: 22px;
      }

      div.landscape {
        page: landscape;
        margin: 40px;
      }
    </style>
  </head>

  <body data-new-gr-c-s-check-loaded="14.1078.0" data-gr-ext-installed="">
    <div class="portrait">This is a portrait page</div>
    <div class="portrait">This is a portrait page</div>
    <div class="portrait">This is a portrait page</div>
    <div class="landscape">This is a landscape page</div>
    <div class="landscape">This is a landscape page</div>
  </body>
  
</html>

  1. named-pages.html‎ 0.7 kB
howcome
Do you want each div to have its own page? If so, you can add this code:

 div { break-after: page }