Here is the CSS I'm using:

@page {
    margin-top: 6em;
    @top-right { content: flow(flow-prince-header) }
    @bottom { content: flow(flow-prince-footer) }
}
#prince-header { flow: static(flow-prince-header) }
#prince-footer { flow: static(flow-prince-footer) }

Then I use 2 divs, with ids 'prince-header' and 'prince-footer':

<div id="prince-header"><img src="..."></div>
<div id="prince-footer"><img src="..."></div>

Then, only the header is displayed on each page, and the footer appears on the last page only. How come?

Probably because the footer div is at the end of the document and the header div is at the beginning. You can move the footer div to the beginning with the header, or use "flow: static(flow-prince-footer, start)" to make it appear from the beginning of the document.

I tried the "flow: static(flow-prince-footer, start)".

Thanks it works!!!