I want to add some text on end of the last page as footer in the vf page rendered as pdf. I have tried with @page :last { }. But It is not working. Any idea?
css:
@page {
@top-center {
content: element(header);
}
@bottom-left {
content: element(footer);
}
}
@page :last {
color: green;
@bottom-center {
content: "text...";
color: blue;
}
}
div.header {
padding: 10px;
position: running(header);
}
div.footer {
display: block;
padding: 5px;
position: running(footer);
}
.pagenumber:before {
content: counter(page);
}
.pagecount:before {
content: counter(pages);
}
Page:
<div class = "header">
------
</div>
<div class="content">
---some content--------------------
</div>
<div class = "footer">
----some content ---
</div>
<div>
</div>
Best Answer
Normally to do what you're attempting, your footer would be defined using an
@page
as well as an@media
. You'd do the same with the psuedo-class ofpage:last
. I don't see any markup in your page layout to provide for the last:page to appear. It would seem you'd want to include it in the div where your footer appears and have it as a child of the footer.Here's an example of what you'd normally expect to see:
You may need to do something like this where it's defined as a child of your element
footer
:To assist with that, you may also need to relate it to a
.pagenumber:last
.As a final note, it's important to remember that PDFs only support CSS 2.1, not CSS 3. So any CSS 3 notation may or may not work. Check the FlyingSaucer Documentation for the latest revisions.