renderas PDF page level styles not working with v30.0 api

I can’t seem to get page level styles to work with version 30.0 of the force.com eclipse IDE in my VF pages. Is this a bug or is there some change that occurred that I’m unaware of?

<apex:page renderAs="PDF" >
<head>
    <style>
        body { font-size: 1em; }
        h1 { text-align: center; margin: 0; font-size: 1.5em; font-weight: normal; }
        hr.seperator { margin: 10px auto 5px quto; width: 50%; color: #000; background-color: #000; height:1px; border: none; }
        h5 { text-align: center; margin: 0; font-size: .7em; font-weight: normal; }
        p { margin-top: 10px; margin-bottom: 10px; }
        p.proclamation { font-size: 1.3em; font-style: italic; }
    </style>
</head>


<apex:form >
    <h1>POWER OF ATTORNEY</h1>
    <hr class="seperator"/>
    <h5>Erasures and Alterations void this instrument</h5>
    <h5>This instrument void after sixty days from date herein</h5>
    <br />
    <p class="proclamation">Know All Men By These Presents, That I, the undersigned, do hereby make, constitute and appoint</p>
    <p>Name:</p>
    <p>Address:</p>
    <p>My true and lawful attorney-in-fact for the following described motor vehicle, to-wit:</p>
    <p><span>Make</span><span>Year</span><span>Serial No.</span></p>
</apex:form>

Thanks for any help.

Contents hide

Answers:

Method 1

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

Maybe you can wrestle with the machine that is the PDF output builder.

For styling to work in that API version, the page will need to look more like this:

<apex:page showHeader="false" applyHtmlTag="false" applyBodyTag="false" renderAs="pdf">
    <html>
        <head>
            <style>
                body { font-size: 1em; }
                h1 { text-align: center; margin: 0; font-size: 1.5em; font-weight: normal; }
                hr.seperator { margin: 10px auto 5px quto; width: 50%; color: #000; background-color: #000; height:1px; border: none; }
                h5 { text-align: center; margin: 0; font-size: .7em; font-weight: normal; }
                p { margin-top: 10px; margin-bottom: 10px; }
                p.proclamation { font-size: 1.3em; font-style: italic; }
            </style>
        </head>
        <apex:form >
            <h1>POWER OF ATTORNEY</h1>
            <hr class="seperator"/>
            <h5>Erasures and Alterations void this instrument</h5>
            <h5>This instrument void after sixty days from date herein</h5>
            <br />
            <p class="proclamation">Know All Men By These Presents, That I, the undersigned, do hereby make, constitute and appoint</p>
            <p>Name:</p>
            <p>Address:</p>
            <p>My true and lawful attorney-in-fact for the following described motor vehicle, to-wit:</p>
            <p><span>Make</span><span>Year</span><span>Serial No.</span></p>
        </apex:form>
    </html>
</apex:page>

Note carefully:

uses showHeader="false"
has both applyHtmlTag="false" and applyBodyTag="false"
addition of <html></html> tags

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

0 0 votes

Article Rating