Delete The Footer Only On The Last Page Using Css

I'm working on generate pdf. I want to remove the last page using css method, i'm trying to get :last-child for remove it but the results is nothing. My code: as you can see in t

Solution 1:

Your problem is your selector, which does not target anything.

This selector: footer .page-number .last:last-child is targeting the last child element with className last of an element with className page-number inside a footer element.

This would look something like this:

<footer><divclass="page-number"><divclass="last"></div><divclass="last"></div><!-- It would target this element --></div></footer>

However, your structure looks like this:

<footer><divclass="right"><spanclass="page-number"></span></div><tableclass="last"></table><footer>

It seems like you are trying to target both.page-number and .last in the last footer element in the page, which can be done using a different pseudo-selector, :last-of-type.

The selector would look like this:

footer:last-of-type.page-number,
footer:last-of-type.last

This targets all elements with className page-number or last inside the last <footer> element on the page.

This of course assumes that your footers are all siblings. If they are not, then you have to move the :last-of-type or :last-child up the tree until you are on the elements which are siblings.

For instance, in this case:

<div><footer></footer></div>
<div><footer></footer></div>
<div><footer></footer></div>

You would want to match the div, rather than the footer, since pseudo-elements are relative to their parent, and each footer is the only footer inside its parent.