mercredi 6 novembre 2019

How to override the print preferences with CSS for various browsers?

I have the following CSS:

   @@media only print {
            @@page {
                size: A4 landscape !important;
                margin-top: 0mm !important;
                margin-bottom: 0mm !important;
            }
                #tblPrint tbody tr:nth-child(even) {
                    background-color: #ededed !important;
                }
            * {
                -webkit-print-color-adjust: exact !important;
            }
}

The problem is as follows:

  1. The @@page properties don’t take effect on all browsers, and the default browser’s print preferences take effect, that is (Chrome: A4/Landscape), (Edge: A4/Portrait), (IE: A4/Portrait), even when I flip the size property to size: A3 portrait !important; the same default browser’s print preferences keeps taking effect.

  2. As I use the “-webkit-print-color-adjust”, then the background-color property takes effect on Chrome even when I turn off “background graphics” feature from browser’s print preferences, however, it doesn’t take effect on IE unless I turn on the “Print Background Color and Images” feature from browser’s print preferences, as for the edge browser am not being able to make background-color CSS property take effect.

The solution I need is to force the properties specified by my CSS to override the Browsers’ Print preferences without having the user to need to specify the paper size, orientation and to check the “Background Graphics / Print Background Color and Images” from the browser Print Preferences for ALL Browsers, please help!!




Aucun commentaire:

Enregistrer un commentaire