Log in / Register

Forum › How do I...?

thead question

pkmiec
PrinceXML is awesome! Finally, a solution that works great. I've noticed one problem and I am wondering if it can be helped.

I have report type of document. The report is a table with thead and tbody. The tbody contains many rows. These rows are split into section. Each section contains a heading row, data rows, and an optional sub-total row.

I noticed that sometimes the bottom of the thead is not rendered correctly. I've narrowed this down to the case when the first row on new page (does not happen on first page) is a heading of one of the sections.

I've cooked up an example which I attached. Compare the table header on the first page to the second page. On the second page, the bottom of the header seems cut-off. Using Prince 6.0 rev 1. Any ideas?

Sorry the inlined css (using this as the html email as well). 

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Report</title>
		<style style='text/css'>
		@page { 
			size: A4 landscape;
			margin: 60pt 40pt 60pt 40pt;
			@bottom-right { 
				content: "Page " counter(page) " of " counter(pages);
				font-size:10px;
				font-family:"Lucida Grande","Lucida Sans Unicode","Sans-serif";
				color:#323232;   
			}
			@bottom-left {
				content: flow(footer);
			}
			@top-left {
				content: flow(header);
			}
		}

		</style>
</head>

<body>
  <table style='padding:0;margin:0;width:100%;border-collapse:collapse;background:#FFFFFF;'>
    <thead>
       <tr>
         <td style='background:#E3E3E3;white-space:nowrap;padding:3px 6px;text-align:left;border:1px solid #B5B5B5;font-size:10px;font-family:"Lucida Grande","Lucida Sans Unicode","Sans-serif";color:#363636;'>
           Property
         </td>
       </tr>
    </thead>

    <tbody>
      <tr style='page-break-before: always;page-break-after:avoid;border-top:1px solid white;'> 
        <td style='font-weight:bold;font-size:10px;font-family:"Lucida Grande","Lucida Sans Unicode","Sans-serif";background:#ffffff;color:#323232;padding:2px 0;'>
           December 2006
         </td>
       </tr>
		        
       <tr style='background-color:#FFFFFF;'>
         <td style='padding:4px;font-size:10px;font-family:"Lucida Grande","Lucida Sans Unicode","Sans-serif";color:#363636;'>
           100 C Street - 100 California Street
          </td>
	</tr>
		        
	<tr style='page-break-before: always;page-break-after:avoid;border-top:1px solid white;'> 
	  <td style='font-weight:bold;font-size:10px;font-family:"Lucida Grande","Lucida Sans Unicode","Sans-serif";background:#ffffff;color:#323232;padding:2px 0;'>
            January 2007
          </td>
        </tr>
		        
        <tr style='background-color:#FFFFFF;'>
          <td style='padding:4px;font-size:10px;font-family:"Lucida Grande","Lucida Sans Unicode","Sans-serif";color:#363636;'>
            451 Ortega Street - 451 Ortega Street
           </td>
         </tr>
      </tbody>
   </table>
</body>
</html>
kmmv
I see the same thing on my machine. Interestingly enough, when there are simply enough rows that the thead element flows naturally onto the next page, it is rendered correctly.

I took out all references to page-break in the source, including the thead element. I then put in a single page-break-before on a TR element and it rendered fine -- the header was fine on the 2nd page.
mikeday
I think that this is because the top border of the first row is collapsing with the bottom border of the thead. Changing the border color to red to make it visible makes this more obvious. If you disable the white top border on the <tr> on the second page it appears to render correctly. However, we may still need to do some further testing of the interaction between collapsing borders and <thead>.
mikeday
Further testing has revealed an issue when a <thead> is repeated on multiple pages in a table with collapsing borders, the bottom border width of the <thead> cells can be calculated incorrectly for subsequent pages following the first page. I've added this issue to the roadmap and we will see if we can fix it for the next release.