Forum How do I...?

Margin top does not collapse on column-spanning element

ThePrintingSquirrel
I create a document from several individual HTML files in a 2-column layout.

The source files contain tables, all of which have a wrapper div that spans both columns.

The issue I'm seeing is that when a natural page break occurs (i.e. the Prince engine decides to insert a page break) the top margin of the wrapper does not collapse with the page margin. I note that margins don't collapse if pages have padding or borders, but this is not the case here.

It does work as expected when I disable the column span and allow tables to occupy space in just one column. But due to the size and complexity of the tables that is not an option for me.

The same happens for H2 headings (and likely other block elements) if I apply the same styles.

Attached are some screenshots -- I have exaggerated the top margin to illustrate the issue.
  • 01-table-not-spanned-across-columns-no-page-break.jpg - I disabled "column-span: all" in the CSS.
  • 02-table-spanned-across-columns-natural-page-break.jpg - CSS sets "column-span: all". No other CSS changes compared to the first screenshot.
Thank you!
  1. 01-table-not-spanned-across-columns-no-page-break.jpg41.7 kB
  2. 02-table-spanned-across-columns-natural-page-break.jpg59.5 kB

Edited by ThePrintingSquirrel

markbrown
Hi,

I'm not sure I understand the document structure, however elements that span columns are taken out-of-flow which means the usual margin-collapsing rules won't apply. I suspect that might be the explanation for what you are seeing, but if not we'll be happy to take a look at some sample code.

Mark
ThePrintingSquirrel
Hi Mark,
thank you so much for your reply. Indeed, it appears that the reason for the observed behaviour is that the column-spanning element is taken out of flow.

It would be helpful if this was mentioned in the docs somewhere. I re-read the section on columns but couldn't find a mention of this.

Is there appetite from your end to update column-spanning CSS to preserve, or be able to optionally preserve, margin collapsing? The current behaviour feels counterintuitive and causes manual rework (adding margin-eliminating helper classes when a page break occurs).
csant
It would be helpful if this was mentioned in the docs somewhere. I re-read the section on columns but couldn't find a mention of this.


Good point, thank you - we'll make sure to add it.