css @page statement not working
Kristof Taveirne
I've added a header and a footer to all my pdf pages.
But now, it seems that the html is rendered behind it.
I've tried setting the @page margin-top attribute to the hight of the
header image and the margin-bottom to the hight of the footer, but it
doesn't help, I see no change when I add this.
In the example you see that the content of $sf_content is printed
behind the header and footer image.
This is what I have:
<html>
<head>
<style type="text/css">
body {
margin:0px;
padding:0px;
width: 210mm;
}
@page {
margin-top:80mm;
margin-bottom:20mm;
}
#printcontent{
margin-left:10px;
margin-right:10px;
padding:0px;
}
#printcontainer{
margin:0px;
padding:0px;
}
</style>
</head>
<body>
<script type="text/php">
if(isset($pdf)){
$w = $pdf->get_width();
$h = $pdf->get_height();
//header
$header = $pdf->open_object();
$img_w = 595.2; // in points
$img_h = 224.6; // in points
$pdf->image("<PathTo>/header.jpg", "jpg",0, 0, $img_w, $img_h);
$pdf->close_object();
$pdf->add_object($header, "all");
//footer
$footer = $pdf->open_object();
$y = $h;
$img_w = 595.2; // 2 inches, in points
$img_h = 83.5; // 1 inch, in points -- change these as required
$pdf->image("<PathTo>/footer.jpg", "jpg",0, $y - $img_h, $img_w,
$img_h);
$pdf->close_object();
$pdf->add_object($footer, "all");
}
</script>
<div id="printcontainer">
<div id="printcontent">
<?php echo $sf_content ?>
</div>
</div>
</body>
</html>
Any idea's how I can fix this?
I also tried setting margin attributes on #printcontainer, but the
ofcourse I only get the margins at the top of the first page and the
bottom of the last.
Thanks in advance!
Greetings,
Kristof Taveirne
BrianS
wrote:
> Hi,
>
> I've added a header and a footer to all my pdf pages.
> But now, it seems that the html is rendered behind it.
> In the example you see that the content of $sf_content is printed
> behind the header and footer image.
This is a problem with the order in which DOMPDF renders elements. The
HTML is rendered first, then the inline script (no matter which comes
first on the page), so the inline script always appears on top of the
HTML.
> I've tried setting the @page margin-top attribute to the hight of the
> header image and the margin-bottom to the hight of the footer, but it
> doesn't help, I see no change when I add this.
>...
> Any idea's how I can fix this?
>
> I also tried setting margin attributes on #printcontainer, but the
> ofcourse I only get the margins at the top of the first page and the
> bottom of the last.
There isn't much support for the @page declaration right now. And as
you have seen, setting the margin on a element within the document
only affects that element at it's boundaries. I believe that if you
set a margin or padding on the body element you will get the result
you want. So try:
body {
margin:80mm 0mm 20mm 0mm;
padding:0px;
width: 210mm;
}
-b
Kristof Taveirne
Thanks Brian! That worked!
It's almost perfect now :-)
Greetings,
Kristof Taveirne.
> --
> You received this message because you are subscribed to the Google Groups "dompdf" group.
> To post to this group, send email to dom...@googlegroups.com.
> To unsubscribe from this group, send email to dompdf+un...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/dompdf?hl=en.
>
>