6

Using Windows 7. The photos(images) are not appearing in the Print preview in chrome browser - version 36.0.1985.125m onwards. The maps works fine. I have attached a sample. This is happening in the Chrome alone.

Note : Works fine with CTRL + P.

Please advise, thanks.

enter image description here

Improve this question
3
  • Not sure what you're asking here. CTRL+P opens the print preview dialog from which you can select your printer or even print to a .pdf.
    – Sarge
    Aug 13, 2014 at 0:44
  • Right-click on the image that's causing problems, choose Inspect Element. A pane will appear. On the left hand side, a line will be highlighted. Right-click on that line, choose Copy. Edit your question and add the lines(s) from the clipboard. That will let us work out exactly what technique is being used to display the image and diagnose farther.
    – Basic
    May 10, 2015 at 2:42
  • Do the images appear on the print out?
    – Burgi
    May 31, 2016 at 8:06

6 Answers 6

Reset to default
7

After Pressing Ctrl+p or giving print in Chrome Select the Checkbox Background colors and images under the Options.

enter image description here

Improve this answer
2
  • 2
    Tried but didn't work.
    – BumbleBee
    Aug 13, 2014 at 17:44
  • 1
    this was the solution for me
    – Brad
    Dec 17, 2014 at 18:23
3

A very simple solution is this one (and it works with firefox and Chrome/chromium):

Open a new tab. Type

data:text/html, <html contenteditable>

in the address-bar.

Thus you can use the browser as a text-editor. Best save the tab as a bookmark (see https://www.schieb.de/720201/firefox-oder-chrome-als-text-editor-benutzen).

Then copy the complete page you want to save to the editor-page. It copies all pictures together with the text. Then it´s really simple to print (as .pdf-file) the page from the editor-page.

Improve this answer
1

Make sure the image is cached before issuing the print command, especially when using document.write

The simplest way I got around the problem in Chrome was to add this to the page I want to print: 

<div><img src="image_that_does_not_show_in_preview.png" style="display:none;"/></div>

This will cache the image and ensure it shows up in Chrome's print preview dialog.

Improve this answer
2
  • Helped me a lot. My issue was image on page has additional get param, i.e. <img src='/images/image.jpg?v=123'>, but printable version has image without param, i.e. <img src='/images/image.jpg'>. So I simly added <img src='/images/image.jpg' style='display: none'> and it works now.
    – userlond
    Aug 2, 2016 at 9:35
  • removed the whole div completely in my case
    – GustavZ
    May 13, 2020 at 9:54
0

I had the same problem and it was driving me crazy. For me, it turned out that Chrome was removing images that were touching or crossing the "invisible" margin, as per the margin settings.

Setting the margin to "Minimal" or "None" made the images appear.

Improve this answer
0

Use CSS to apply the display style to the img. either inline or specific enough that the print preview's applied display:none; is overriden.

To clarify add style="display:block;" to an <img [insert style here] src"/i-am-an-image.jpg"/> element

That solved it for me, hope this helps

Improve this answer
-1

Just add the below styles to make it work img { max-width: 100%; height: auto; }

Its the width of the image being set to 0 in the print which is causing the issue.

Let me know if this works for you.

Improve this answer
1
  • Where would the OP enter this code?
    – Burgi
    May 31, 2016 at 8:05

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .