HTML based report being ripped to pieces by pagination
I've created a 开发者_如何学PythonHTML based report that can be variable lengths and number of segments in C# (which is why Crystal Reports wasn't used) and I can't use the wonderful http://www.printfriendly.com/ as the report is Intranet based (boooo, hiss).
I've created a media=print CSS file that is used to make the formatting as paper and ink efficient as possible but I have a problem. There is a very long table in the report with around 50 table rows, each one around height: 200px. Unfortunately some of the table rows are being sliced due to the automatic page breaking, with part of the table row on one page and the rest on the next page. Is there anyway (hopefully via CSS), to set the pagebreaking options to not seperate table elements (or similar elements)?
Thanks, Alex
The page-break-inside: avoid
property should control this, but it looks like most browsers don't support that on tr
or td
elements. In my testing, Opera is the only one that honors this property, as used in the following test:
<!DOCTYPE html>
<title>Page Break Test</title>
<style>tr, td { page-break-inside: avoid }</style>
<table border=1>
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
<tr height=200><td>This is a test. This should be tall.<td>Another column.
</table>
If you can use Opera, this might be good enough. Another option would be to look into Prince for printing your reports, as it tends to have much better support for print stylesheet features than the browsers do (though I haven't tested this feature in particular).
If your row height happens to be fixed, you could figure out how many rows fit on a page, then use page-break-after: always
on every n-th row to force page breaks in the appropriate places. It's a bit of a hack, but it might be your best option.
Unfortunately, it is impossible to reliably accomplish what you want with HTML.
If you want a high level of control over what is printed, I suggest you have your report generator output PDF or XPS rather than HTML (or as Brian Campbell advised, by using a tool such as Prince that can take HTML and convert it to PDF).
精彩评论