Forum How do I...?

Can I have a table that page-breaks next to a float?

jnoble
I'm new to Prince, and trying to re-create a layout I've used in Excel before. The HTML and CSS seem straightforward, but I've run into a problem.

I'm trying to layout a page-breaking table (in a non-floated 50% width DIV on the left) next to a short explanation (in a floated 50% width DIV on the right).

I'd like the explanation DIV to align with the top of the table's DIV, which it normally does if I float both DIVs (left and right respectively), both in a browser and in Prince. However, since the table is inside a floated DIV, Prince won't page break it, so that won't work. (The table may contain enough rows to need to page break, so this is not workable.) Floating blocks are not eligible for page breaking, as the manual states.

So, I undid the float on the left DIV, and the page breaking works perfectly now on the left DIV (yay, Prince!). But the DIV on the right (float: right) scoots down the page to begin vertically after the DIV on the left ends, as if I had said "clear: left" on it. I've tried "clear: none", which has no effect. I've tried making each DIV width 45% to ensure that there's no overlap, to no effect. Note that this clear-like behavior also appears in a browser, so there may just be something I'm not understanding about the floating here.

I also tried absolute positioning for the explanation DIV on the right -- which I think should work fine and is intuitively what I want anyway. In a browser, I can place that right DIV offset such that it's where I want it. But Prince always puts it on the second page IF the table on the left page-breaks (if the table is short and doesn't page-break, the right DIV goes where I want it to). In the case of a page break in the table's DIV, the explanation DIV on the right is positioned "absolutely" where I want it, but on the second page, not on the first. I don't want it to get moved onto the second page.

Thoughts sought!

Joel Noble
Denver, CO


[edited for -- hopefully! -- clarity]
xuehong
Hi,
Prince won't let anything float around a table regardless of the table width (unless it is an inline-table, but then inline-table won't do page break).
Your idea of leaving the table as a normal block and absolutely positioning the explanation is a good one! However, if you want the explanation to always appear on the first page of the table, you will need to put the explanation before the table in your source file:
<div style="position:relative">
    <div class="explanation" style="position:absolute; top:0; left:45%">
        Explanation!
    </div>
    <table style="width:45%">
        ........
    </table>
</div>

I hope this helps!

Xuehong
jnoble
Wow, OK. I guess I'm surprised that order in the source document matters, but indeed it works and is easy and under my control, so I'm a happy camper!

Thank you!