Hide Print Button While Printing A Page

I was in a problem today. I tried to print a page which I developed in PHP. I inserted a PRINT button in it. but while I was using JS function window.print() which was printing my PRINT button too! So I took the help of CSS to solve the problem. just used 3 line codes before the button. I named the button id as “btnPrint” and in CSS it was set as display:none. So while the page was being printed, the button was not!

You can follow the code! it’s simple 🙂

<style type="text/css">
@media print {
input#btnPrint {
display: none;

<input type="button" id="btnPrint" onclick="window.print();" value="Print Page" />

11 thoughts on “Hide Print Button While Printing A Page

  1. Great one. I have implemented this in javascript but your is much more sophisticated. Can you tell me how can you bring it back once printing is done?

  2. please tell me the above code whatever u post that is printing the page..But i want to scan the page.Please tell me the code to scan the page by using php

    1. Cover up the button with a post it note, once done put the screen into the scanner and scan the screen… no php needed

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s