Velvet Star Monitor

Standout celebrity highlights with iconic style.

general

Printing background colours in Chrome

Writer Andrew Mclaughlin

I'm trying to print a php generated document in Chrome. On the browser it looks fine, but my printer will not print any coloured backgrounds. I know that IE has an option to print background but Chrome does not.

As the end user will print this off, I do not want to find alternatives like a screen grab or save file etc. I want to find a real solution to this.

Here is the page i want to print, for information

Can anyone offer a suggestion please?

7 Answers

There's a long long two years old thread at Chrome support, full of users complaining exactly how ludicrous is the lack of so basic function, as background printing, in Chrome.

TWO Years!

My advice is to use Firefox or Opera until we get heard at Google.

2

There is now a chrome extension that injects -webkit-print-color-adjust:exact. I tested it with Chrome 23 and works fine.

CSS to allow chrome to print backgrounds:

See here:

Considering that it seems to me that the OP was "CREATING" the page, this belongs to stackoverflow rather then SuperUser.

In any case, the good solution is... NOT to use background-color and background-image! ...also because Chrome is still not supporting printing them (Jan 2012!), and even with other browsers the user have to go through printing options...

If you are creating the page it's reasonable. See for instance:

I use something like:

<div class='container'> <img src='background-image or color' class='background'/> normal stuff as it should be
</div>

then in css:

img.background { position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100%;
}

of course you can then adapt the css and the classes to your use

It sounds like it's finally coming:

for the moment in the form of a specific -webkit style:

see

-webkit-print-color-adjust:exact;

I could not find an option in chrome but if you are editing the page you can add it; otherwise simply fire the developers tool and add this style to the body.

Works!!!!!!

A very different answer from myself ;-)

Instead of printing it directly from the browser, try taking a screen shot and printing it from an image editor.

1

Use Internet Explorer as this option is not in Chrome. Go to file - page setup - print background colors and images and check it.

Or, in IE, go to tools - internet options - advanced - printing - print background colors and images

1

Your Answer

Sign up or log in

Sign up using Google Sign up using Facebook Sign up using Email and Password

Post as a guest

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy