user89862
user89862

Reputation:

Stylesheet for printing, background-color ignored

I create a table where I cycle between giving each tr the class "odd" and "even". In my stylesheet I've got this:

table tbody tr.odd {
    background-color: #cccccc;
}

This works from the browser but not when printing. Everything else in my media stylesheet works except this background-color.

I have colors enabled for printing, I can print images with colors... so?

Upvotes: 5

Views: 1483

Answers (2)

ziaulain
ziaulain

Reputation: 94

You can achieve background color of a div by in print preview. The border color in divForBgColor:before will be the background color of divForBgColor.

.divForBgColor {
    position: relative;
    overflow: hidden;
}

.divForBgColor:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border: 9999px solid #f1f2f2;
    z-index: -1;
}

Upvotes: 0

Delan Azabani
Delan Azabani

Reputation: 81384

By default, most browsers ignore CSS background colours and images when printing. This can only be overridden by changing the setting in the browser, if the browser even has such an option (some don't, as Quentin points out).

Upvotes: 6

Related Questions