Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS paged media :last page selector

I need to know if I can modify content on the last page with the :last selector.

I'm not sure if it exists, I see it being used in other stackoverflow answers like this: Footer on last printed page. But I can't find it in the documentation and it does not work when I try to use it.

I'm trying to clear the content on the footer of my last page like this:

@page {
        @bottom-right {
            content: "Please turn over";
        }
}

@page :last {
        @bottom-right {
            content: none;
        }
}

It works when I use it with the :firstselector. How can I get the effect for the last page?

I'm using Weasyprint to print PDF files.

like image 840
Niel Avatar asked Feb 09 '17 12:02

Niel


2 Answers

This can be achieved using named pages.

Create an element on the last page (or use an existing one that will appear on the last page) and assign it a last-page class.

Example below:

HTML

<div class="last-page"></div> <!-- Or add this class to an existing element that appears on the last page -->

CSS

.last-page {
    page: last_page;
    page-break-before: always; /* Use if your last page is blank, else omit. */
}

@page {
   @bottom-right {
       content: "Please turn over";
    }
}

@page last_page {
    @bottom-right {
        content: none;
    }
}

Tested with Weasyprint - worked a charm.

like image 159
Matt Doyle Avatar answered Oct 21 '22 11:10

Matt Doyle


Based on the CSS3 Page docs it appears the :last pseudo-class was removed (or never included).

It might be possible to target the last page using the :blank pseudo-class if you can force a page break at the end of your document. This might have unwanted effects on other blank pages though.

like image 32
Brett DeWoody Avatar answered Oct 21 '22 11:10

Brett DeWoody