Menu
one of my application is web based POS(Point Of Sale). so while printing invoices in chrome. the page header and the page footer automatically inserted by the browser that I want to supress via the page and without user intervention..
I applied some CSS over-here in print-media,
@media print {
#header, #footer {
visibility: hidden !important;
display: none !important;
}
}
But it's not applying, maybe the selector isn't correct?
And I also tried by reducing the margin as well, but its cutting/ overriding the page-content, if print has multiple pages.. And one more thing, i don't want to disable the print preview option for chrome..
Any one has good solution for this?
Best Regards..
485
Approach 1: Select the header using a CSS selector and modify the style property such that the value of the display property is set to none. This will hide the selected table header element from the page. Example: html.
Go to Insert > Header or Footer, and then select Remove Header or Remove Footer.
In the WordPress admin panel, click Appearance > Customize. To remove the header, click Header > Header layout and for the Layout setting select None.
use
@page{margin:0px auto;}
in your css script. This will most likely throw off your page layout when printing, so you'll probably want to add a #container div with the correct padding to make your page look good again. Only tested on Google Chrome.
51
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
