Log in / Register

Forum › Bugs

Column-fill not respected

Rutger
Hi,

It seems like there is an issue with column-fill: auto when one element has page-break-before and column-span.

Given the following HTML:
<!DOCTYPE html>
<html>
<head>
<style>
</style>
</head>
<body>
<div style="column-count: 3; column-fill: auto;">
<h1 style="column-span: all;">Header</h1>
<p>Some text some text some text some text some text</p>
<p>Some text some text some text some text some text</p>
<h2 style="page-break-before: always; column-span: all">Header</h2>
<p>Some text some text some text some text some text</p>
</div>
</body>
</html>



I would expect that the paragraphs on page 1 would both be in the first column, but they are both balanced on the page. When I remove the column-span from the H2 it works as expected.

Is this expected behaviour? And if it is, is there a way that I could prevent this from happening?

Thanks in advance!

With kind regards,
Rutger
markbrown
Yes, this is expected behaviour. The spec says that the column-fill property affects content that does not immediately precede a spanner.

You could prevent the balancing by splitting up the multicol container. E.g.:
<!DOCTYPE html>
<html>
<head>
<style>
</style>
</head>
<body>
<div style="column-count: 3; column-fill: auto;">
<h1 style="column-span: all;">Header</h1>
<p>Some text some text some text some text some text</p>
<p>Some text some text some text some text some text</p>
</div>
<div style="column-count: 3; column-fill: auto;">
<h2 style="page-break-before: always; column-span: all">Header</h2>
<p>Some text some text some text some text some text</p>
</div>
</body>
</html>
David J Prokopetz
I'm running into a similar issue, and I think your interpretation of what "immediately precedes" means may be somewhat broader than the spec intends. Consider the attached example - here, the column balancing behavior on page one is affected by the styling of an element that appears not only several pages away, but inside a different parent element.
  1. column-balance-test-all.html‎ 8.2 kB
  2. column-balance-test-all.pdf‎ 55.0 kB
Rutger
Hi David,

You where quicker then me in writing an answer.

I can also confirm this behavior, as my example was a very much stripped down snippet. In my situation the content is also nested in separate parent elements.

For now I'm taking the approach of flattening and wrapping all content in Javascript before Prince renders it. Not finished yet, but making good progress!

Would love for this to be solved in Prince though!
markbrown
Ok, I see the issue now.

We have on the roadmap a point about balancing columns on all pages, and I think that would cover this problem too.

Thanks for letting us know you've hit the problem - we'll take that into account.

Mark
David J Prokopetz
It might at that. At a glance, it seems like achieving the desired behaviour in this situation would require the "does not immediately precede a spanner" clause to be handled in a way that considers only whether there's a following spanner on the current page, rather than anywhere in the document.
Rutger
I was wondering if there is an update on this?

Working on some new projects now, and this still seems to be an issue.
Reading through the comments here again, I think the solution mentioned by David is the correct one. It should be a check per page, as otherwise the behaviour is really not what you would expect in many cases.

Or if the ceck is done before the pages are rendered, maybe it would be possible to check if the spanning element has a new page declared, either by 
page: custompage;
or 
break-before: page;
. That would make things a lot more predictable I think.

For example, I have a section that renders in 3 columns.That section contains an image that needs to span all columns on a new page. This causes the pages before the image to balance the columns.

Edited by Rutger