Docverter / docverter

Docverter Server
Other
831 stars 100 forks source link

HTML/CSS Gradient Dropped Does not Appear when Converting to PDF #43

Closed jakemwp closed 8 years ago

jakemwp commented 8 years ago

Hey guys,

Here is the example HTML page I have: http://67.227.192.13/~hosttestmyphpski/html_to_pdf/html_templates/TestDentalOffice.html

Here is the PDF that comes out:http://67.227.192.13/~hosttestmyphpski/html_to_pdf/html_templates/TestDentalOffice.pdf

As you can see the gradient is dropped from the PDF when generated.

Here is the HTML that I am using in particular: CSS

grad1 {

height: 100px;
background: grey;
background: -webkit-linear-gradient(#A9A9A9, #FFFFFF);
background: -o-linear-gradient(#A9A9A9, #FFFFFF);
background: -moz-linear-gradient(#A9A9A9, #FFFFFF);
background: linear-gradient(#A9A9A9, #FFFFFF);

}

HTML:

<div id='grad1'>
    <table class=\"small\" width=50% border=0 cellpadding=0 cellspacing=0 style='float: left'>
        <col width='50%'>
        <col width='50%'>
        <tr>
            <td><img src=http://i.imgur.com/TzrJVff.png alt=logo style=width:100%; align=middle;></td>
        </tr>
        <tr>
            <td>
            <br><br>
            <center>
            2001 Windy Terrace Suite F Cedar Park , Texas , 78613
            <br><br>
            Phone. 888.759.4287 |  Fax. 512.989.9559
            <br><br>
            sales@capitaldentalequipment.com
            </center>
            </td>
        </tr>
    </table>
    <table class='small' style='float: left' width='50%'>
        <col width='50%'>
        <col width='50%'>
        <tr>
            <td colspan='2' valign=\"top\"><span class='grey'><center><h1> <br><br>INVOICE</h1><br></center></span></td>
        </tr>

        <tr>
            <td align='right'><br>Invoice Date:<br></td>
            <td align='left'><br>February 4, 2016</td>
        </tr>
        <tr>
            <td align='right'>Account:<br></td>
            <td align='left'>Test Dental Office</td>
        </tr>
        <tr>
            <th align='right'>Balance Due Date:<br><br></th>
            <th align='left'>February 11, 2016 <br><br></th>
        </tr>
        <tr>
            <th align='right'>Total Invoice Amount:<br></th>
            <th align='left'>$ 49,500.00</th>
        </tr>
    </table>
</div>

I have tried changing the CSS to use Grey/White instead of hex codes but that didn't work either.

Anyone know what the problem is?

peterkeen commented 8 years ago

Docverter only allows a limited subset of CSS3, mostly having to do with the print media module. Gradients don't make the cut.

On Mon, Feb 29, 2016 at 1:42 AM, jakemwp notifications@github.com wrote:

Hey guys,

Here is the example HTML page I have: http://67.227.192.13/~hosttestmyphpski/html_to_pdf/html_templates/TestDentalOffice.html

Here is the PDF that comes out: http://67.227.192.13/~hosttestmyphpski/html_to_pdf/html_templates/TestDentalOffice.pdf

As you can see the gradient is dropped from the PDF when generated.

Here is the HTML that I am using in particular: CSS

grad1 {

height: 100px; background: grey; background: -webkit-linear-gradient(#A9A9A9, #FFFFFF); background: -o-linear-gradient(#A9A9A9, #FFFFFF); background: -moz-linear-gradient(#A9A9A9, #FFFFFF); background: linear-gradient(#A9A9A9, #FFFFFF); }

HTML: [image: logo] https://camo.githubusercontent.com/0fcd138d49e0882562d64c433c4f1ef3c7f05556/687474703a2f2f692e696d6775722e636f6d2f547a724a5666662e706e67

2001 Windy Terrace Suite F Cedar Park , Texas , 78613

Phone. 888.759.4287 | Fax. 512.989.9559

sales@capitaldentalequipment.com

INVOICE

Invoice Date:

February 4, 2016 Account: Test Dental Office Balance Due Date:

February 11, 2016

Total Invoice Amount: $ 49,500.00

I have tried changing the CSS to use Grey/White instead of hex codes but that didn't work either.

Anyone know what the problem is?

— Reply to this email directly or view it on GitHub https://github.com/Docverter/docverter/issues/43.