CSS paged media :last page selector

Question

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.

Solution 1

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.

Solution 2

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.

Comments

[Niel]

Thanks for clearing that up. I thought of using :blank as an option as well.

[Brett DeWoody]

Trying to think of some other options - something like :right + :not(:left) but that would need testing to see if it works.

[G_V]

It kind of makes sense. Clearly a PDF printer knows where a document starts and its current position. The last page depends on all the content before it, unless explicitly set manually. I don't know of a way to set "document ends here", but I'd imagine any software attempting should first render the whole document to determine the last page and then retrieve and restyle this page to achieve this.

[Anton Trishenkov]

@G_V so when you print number of pages on each page it is not confusing driver, but when you need set last page's property - it confusing. Excellent.

[r1987]

It seems plausible, but this doesn't seem to work when you try to print a page out on Chrome browser.

[logicOnAbstractions]

You're a genius. Works fine for producing PDF at least, displays fine in-browser on FF & Chrome (recent versions at least)