Dynamic running header with flying-saucer

Question

I have been using flying-saucer for my PDF generator service.

I am correctly using css @Page rules for adding running headers and footers on each page

@page {
    size: A4 landscape;
    margin: 10%;
    @top-left { content: element(header); }
    @bottom-left { content: element(footer); }
}

header {
    position: running(header);
}

footer{
    position: running(footer);
}

---

Question

My HTML and generated PDF contains below sections (just as an example)

1. Career Objective
2. Summary
3. Qualification
4. Employment History
5. Project Experience

where:

• Each Section starts on a new page.
• No two sections on same page.
• Depending on content each section may/may not occupy multiple pages

My requirement is to have header on each page displaying the section name the page contains.

E.g. if project experience occupy two pages then both of the page headers should contain word Project Experience

Can anyone point me to a possible solution for this ?

Answer 1

Finally I was able to crack it down and it was rather simpler than I was expecting.

---

Answer is to create multiple tags (one per section) instead of having one common header for the entire report. Mark postition each header as running and that's it. Flying-saucer will do its job

.

For example

My CSS is still the same (as it is in question)

@page {
    size: A4 landscape;
    margin: 10%;
    @top-left { content: element(header); }
}

header {
    position: running(header);
}

I just refactored my HTML

<div class="page">
    <header>Section 1 / My Fancy Report</header>
    <h2>Section 1</h2>
    <!-- Section 1 content --> 
</div>
<div class="page">
    <header>Section 2 / My Fancy Report</header>
    <h2>Section 2</h2>
    <!-- Section 2 content --> 
</div>

If any of the section here overflows to the next page flying-saucer correctly repeats the sectional header on next page.

Hope it helps others.