How to setup a 3-column layout using pisa xhtml2pdf

Question

How to setup a 3-column layout using pisa xhtml2pdf

2.1k Views Asked by user1408125 At 19 October 2024 at 21:43

I have a list of items that I want to layout in three columns. The list is pretty long (using a 3-column layout might take 5 pages). The conditions are as follows:

The first page has a header that is about 200px in height and 100% in width. After the heading in the first page, the page should start displaying the list in 3-columns.
"Middle and last" pages dont contain any header.
Last page contains an image.

I tried to give a margin-top for the second and third frames, the first page looks right but the "middle" pages don't. The margin-top gets applied to all pages.

Help will be appreciated.

Original Q&A

There are 1 best solutions below

**benjaoming** · Answer 1

When a frame is filled, pisa will automatically use the next frame. The example is explained in usage.rst:

<html>
<head>
<style>
    @page {
        size: letter portrait;
        @frame header_frame {           /* Static frame */
            -pdf-frame-content: header_content;
            left: 50pt; width: 512pt; top: 50pt; height: 40pt;
        }
        @frame col1_frame {             /* Content frame 1 */
            left: 44pt; width: 245pt; top: 90pt; height: 632pt;
        }
        @frame col2_frame {             /* Content frame 2 */
            left: 323pt; width: 245pt; top: 90pt; height: 632pt;
        }
        @frame footer_frame {           /* Static frame */
            -pdf-frame-content: footer_content;
            left: 50pt; width: 512pt; top: 772pt; height: 20pt;
        }
    }
</style>
<head>

<body>
    <div id="header_content">Lyrics-R-Us</div>
    <div id="footer_content">(c) - page <pdf:pagenumber>
        of <pdf:pagecount>
    </div>
    <p>Old MacDonald had a farm. EIEIO.</p>
    <p>And on that farm he had a cow. EIEIO.</p>
    <p>With a moo-moo here, and a moo-moo there.</p>
    <p>Here a moo, there a moo, everywhere a moo-moo.</p>
</body>
</html>

The HTML content will flow from Page1.Col1 to Page1.Col2 to Page2.Col1, etc. Here's what the resulting PDF document could look like:

+-------------------------------+    +-------------------------------+
| Lyrics-R-Us                   |    | Lyrics-R-Us                   |
|                               |    |                               |
| Old MacDonald   farm he had a |    | a moo-moo       everywhere a  |
| had a farm.     cow. EIEIO.   |    | there.          moo-moo.      |
| EIEIO.          With a moo-   |    | Here a moo,                   |
| and on that     moo here, and |    | there a moo,                  |
|                               |    |                               |
| (c) - page 1 of 2             |    | (c) - page 2 of 2             |
+-------------------------------+    +-------------------------------+

How to setup a 3-column layout using pisa xhtml2pdf

There are 1 best solutions below

Related Questions in PISA

Related Questions in XHTML2PDF

Trending Questions

Popular # Hahtags

Popular Questions