Philip Chatzigeorgiadis Active Member Licensed User Longtime User Oct 16, 2020 #1 When I try to print a page with an ABMReport, the bottom of the sheet- i.e. not occupied by the ABMReport contents - will have the color specified for the background color of the webpage which creates the ABMReport. If this color is white, everything is OK. If the color is other than white, this color shows in the report. I have attached here a sample (see Pic1) showing the print preview of a page with a red background (just to highlight the issue). One workaround is to disable printing background graphics, which takes care of the background color but also ommits other useful colors from the report (see Pic2). I tried adding this command in Sub BuildPage(): B4X: page.InjectCSS("@media only print {body{background-color: white}}") but no changes occured in the printed document. Is there a way to make the printed report sheet background white, regardless of the webpage background color?
When I try to print a page with an ABMReport, the bottom of the sheet- i.e. not occupied by the ABMReport contents - will have the color specified for the background color of the webpage which creates the ABMReport. If this color is white, everything is OK. If the color is other than white, this color shows in the report. I have attached here a sample (see Pic1) showing the print preview of a page with a red background (just to highlight the issue). One workaround is to disable printing background graphics, which takes care of the background color but also ommits other useful colors from the report (see Pic2). I tried adding this command in Sub BuildPage(): B4X: page.InjectCSS("@media only print {body{background-color: white}}") but no changes occured in the printed document. Is there a way to make the printed report sheet background white, regardless of the webpage background color?
alwaysbusy Expert Licensed User Longtime User Oct 16, 2020 #2 That would indeed be the way to do it with CSS. Maybe try making a physical .css file and load it with page.AddExtraCSSFile() because InjectCSS works in another way that may not work with such media queries. Upvote 0
That would indeed be the way to do it with CSS. Maybe try making a physical .css file and load it with page.AddExtraCSSFile() because InjectCSS works in another way that may not work with such media queries.
Philip Chatzigeorgiadis Active Member Licensed User Longtime User Oct 16, 2020 #3 alwaysbusy said: That would indeed be the way to do it with CSS. Maybe try making a physical .css file and load it with page.AddExtraCSSFile() because InjectCSS works in another way that may not work with such media queries. Click to expand... Tried this with a separate CSS file in css\custom folder. Red color still showing. BTW, my CSS knowledge is next to nil - I only copied the @media only print {body{background-color: white}} to this file. Is that enough? Upvote 0
alwaysbusy said: That would indeed be the way to do it with CSS. Maybe try making a physical .css file and load it with page.AddExtraCSSFile() because InjectCSS works in another way that may not work with such media queries. Click to expand... Tried this with a separate CSS file in css\custom folder. Red color still showing. BTW, my CSS knowledge is next to nil - I only copied the @media only print {body{background-color: white}} to this file. Is that enough?
alwaysbusy Expert Licensed User Longtime User Oct 16, 2020 #4 I think the two css rules are fighting each other and the class in the body tag always seems to win over the @media one. Try this: Code: @media print {#print-body{background-color: #fff !important}} Alwaysbusy Upvote 0
I think the two css rules are fighting each other and the class in the body tag always seems to win over the @media one. Try this: Code: @media print {#print-body{background-color: #fff !important}} Alwaysbusy
Philip Chatzigeorgiadis Active Member Licensed User Longtime User Oct 19, 2020 #5 alwaysbusy said: I think the two css rules are fighting each other and the class in the body tag always seems to win over the @media one. Try this: Code: @media print {#print-body{background-color: #fff !important}} Alwaysbusy Click to expand... I tried it first with page.InjectCss and then with page. AddExtraCSSFile. No success. Upvote 0
alwaysbusy said: I think the two css rules are fighting each other and the class in the body tag always seems to win over the @media one. Try this: Code: @media print {#print-body{background-color: #fff !important}} Alwaysbusy Click to expand... I tried it first with page.InjectCss and then with page. AddExtraCSSFile. No success.
