CSS transformed content is not accurately rendered in pdf and pdf preview
Reported by
obje...@tibco.com,
Oct 6 2016
|
|||||||||||||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/53.0.2785.143 Safari/537.36 Steps to reproduce the problem: 1. Open the attached transformed.html file in chrome. 2. Open the print preview. 3. Select the "save as pdf", "landscape" and "letter" options in the left hand menu. What is the expected behavior? The preview and the pdf should be a visually accurate represenation of the browser view. What went wrong? One row of text is shifted outside of its container and can't be seen. The issue seems to be related to the transform operation done to the content. The content that is a certain distance from the top of the document gets this shifted effect. I've been able to get similar results in A4 and A3 layouts as well. I've also gotten the same results on Windows 7 and similar results on a mac running Mac OSX El capitan. Did this work before? N/A Chrome version: 53.0.2785.143 Channel: stable OS Version: 10.0 Flash Version: Shockwave Flash 23.0 r0 The example file is a condenced version of a much more complex table layout with many columns. The transform is applied to fit a greater set of columns to one page. When the whole table is displayed, a whole row gets the shifted effect (see transformed_whole_row.html).
,
Oct 12 2016
Does it work correctly in other browsers?
,
Oct 13 2016
The issue exists in older chromium versions as well, on both mac and Windows. This exact error does not occur in browsers by other vendors but they have other issues when printing to pdf. The Chromium pdf export is the best one I've encountered, and better than for example Microsoft's print to PDF option. Being able to print a transformed page without artifacts would make the best export even better. This issue seems like an arithmetic error since it happens in a quite narrow span.
,
Oct 13 2016
,
Oct 13 2016
,
Oct 19 2016
Probably related: https://bugs.chromium.org/p/chromium/issues/detail?id=657402
,
Mar 26 2017
See bug 657402 for some background on why you get an output that looks like it has artefacts - what you're in fact seeing is the paginated layout before it had the transform scaling applied. (Try removing the transform from your test case to see what I mean). Oddly enough, I think the behaviour here is correct because: - I think it is expected for the page layout to respect the dimensions of its elements before the transform was applied. So if you have a stack of divs that is 5000px high and then do scale(0.1) - you will still get a document 5000px high with scrollbars even though your stack of divs doesn't reach the bottom the viewport. The same applies for paged media - inasmuch as no provision is made for any other distinct behaviour in the the specs for transform/paged media. - While you've allowed the cells to straddle the page breaks by making them absolute the inline content cannot so it gets pushed down to respect the page break. You've applied overflow:hidden to the table cells, so that has given the final product a weird artefacty look when scaled back down from its initial paged layout. Please add any info you think might change this analysis. |
|||||||||||||||||||||
►
Sign in to add a comment |
|||||||||||||||||||||
Comment 1 by ligim...@chromium.org
, Oct 12 2016Labels: Needs-Bisect