Render as PDF page orientation

cssstylevisualforce

I'm trying to have both portrait (page one) and landscape (page two) in a visualforce page which is 'render as PDF'.
I have tried various options but cannot get it to work, I can only get all landscape or all portrait, here is the code, please help!
     

<apex:page Controller="RAMS_Controller" showHeader="false" renderas="pdf" applyBodyTag="false" applyHtmlTag="false">
    <html>
        <head>
            <style>
                @page{
                    size: A4 landscape;
                }
            </style>
    <div style="text-align:center;">
        <p style="text-align:center;font-size: 25px"><font face="Arial">Page One</font></p>
    </div>

    <div style="text-align:center;">
    
        <p style="text-align:center;font-size: 25px"><font face="Arial">Page Two</font></p>
    </div>

There is closing tags in the above code, but I can't get them to show on the page!

Best Answer

Per this question, you can alias different sizes (@page aliasName):

@page land { size:landscape; }
@page port { size:portrait; }

Which you can then apply via the page CSS attribute:

.landscapePage { page:land; }
.portraitPage { page:port; }

Which in turn renders the pages as you desire:

<div class="portraitPage">
    <p>Some page content in portrait</p>
</div>
<div class="landscapePage">
    <p>Some page content in landscape</p>
</div>
Related Topic