Forum Bugs

Irregular behaviour of tables with "break-inside: avoid-page" when parent element has columns

David J Prokopetz
Consider the attached examples.

In the example two-column-table-01.html, the table fits on the first page of the document, and has balanced column distribution.

In the example two-column-table-02.html, the table breaks to a new page, and has unbalanced column distribution.

The only difference between the two documents is that in the latter, the table element is given the property "break-inside: avoid-page".

if I had to speculate, I'd guess that what's going on here is that when applied to table elements, the value "avoid-page" is being treated as equivalent to "avoid", which causes the table to resist breaking to the second column until it's filled the maximum possible column height (which in turn causes the unintended page break).

EDIT: Apologies – when I initially posted this I'd mistakenly attached the same set of documents twice. It should be corrected now.
  1. two-column-table-01.html4.0 kB
  2. two-column-table-01.pdf36.3 kB
  3. two-column-table-02.html4.0 kB
  4. two-column-table-02.pdf36.7 kB

Edited by David J Prokopetz