CODEWITHSUNDEEP
javascripthtmlcssgoogle-chrome
Chirag Khatsuriya
Chirag Khatsuriya

Reputation: 635

Printing issue with HTML page

I am facing issue while print image in chrome, I tried to print in Firefox it works.

Below is my sample code:

<html>
    <head></head>
    <body>   
        <input 
            type="button" 
            value="Print this page" 
            onclick="printpage()"  
            style="height: 65px; width: 140px; top: 890px; left: 510px; position: absolute;">          
        <img 
            src="BuilderLogo.png" 
            id="ctl02_tabEBrochures_55_" 
            style="height: 65px; width: 140px; top: 1050px; left: 810px; position: absolute;">    
        <input 
            type="button" 
            value="Print this page" 
            onclick="printpage()"  
            style="height: 65px; width: 140px; top: 1050px; left: 510px; position: absolute;">
    </body>
</html>

Function "PrintPage()" just has Window.print().

When I print the page, images do not print. However, they show when I open it in the browser.

As I show in the screenshots below, I have added two print buttons. In print, only the first print button is showing.

I notice that when I set top of any image control more than 900px, than I am facing this issue.

Original Page: image on screen with two print buttons showing

Print Ouptput:

image on print with only one button showing

What could be the problem?

Upvotes: 0

Views: 622

Answers (1)

Chris Pickford
Chris Pickford

Reputation: 8991

While you need to define a separate stylesheet for print rather than using the same one as for screen, I suspect that your issue is something as simple as Chrome disabling the printing of images. See the following screenshot for how to enable:

Chrome print options

Upvotes: 1

Related Questions