Note that there are some explanatory texts on larger screens.

plurals
  1. POChrome System Print Dialog Text White Highlight
    primarykey
    data
    text
    <p>I'm having an issue in Google Chrome on Windows only (tried IE11, FF, Opera, Safari) with printing. The issue only occurs when using the <strong>system</strong> print dialog. Using the Chrome Print Preview renders expected results, but it's just when using the system print dialog that I get the issue.</p> <p>The first image below is the expected result (printed using the normal Chrome Print Preview window): <img src="https://i.stack.imgur.com/1uhOp.jpg" alt="Expected printout result"></p> <p>And this one is what I get (using the system print dialog): <img src="https://i.stack.imgur.com/sz0ZJ.png" alt="Actual result"></p> <p>I think it's pretty self explanatory what the issue is - all the text has a white highlight.</p> <p>The other possibly related issue is that none of my fonts are correct - the PDF is rendering using Arial, instead of the correct fonts I've declared.</p> <p>These were printed to a PDF printer, however the results are exactly the same when printed on paper, and I've tried two different manufacturers of printers.</p> <p>I would post CSS (as I suspect that's the issue) but I'm not really sure what to post.</p> <p>I've tried changing heaps of different CSS values from various elements (too many to name), but I've tried the obvious ones: background-colors and backgrounds, tried removing opacities etc.</p> <p>Any ideas would be greatly appreciated!</p> <p><strong>Edit:</strong> A live URL with an example is at: <a href="http://www1.goinewsletter.com/post/521" rel="nofollow noreferrer">iNewsletter</a></p> <p><strong>Edit:</strong> Just wrote a simple test case which also fails:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt; &lt;style&gt; #bg {width: 500px; height: 500px;} #text {margin-top: -500px;} &lt;/style&gt; &lt;/head&gt; &lt;body&gt; &lt;div id="bg"&gt;&lt;img src="http://inws-cache-dev.s3.amazonaws.com/3-resize-1024-768.jpg" width="500" height="500" /&gt;&lt;/div&gt; &lt;div id="text"&gt;This text will have a white highlight&lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>Which leads me to think it's a Chrome bug</p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload