hide some part of page while printting using css

Hi *.*,

In my project I need to implement functionality where I have to print Order print receipt. But the real thing is I have to hide some part of page when I print page and I have to use same page for this.

The easy solution for this problem is you need to give one more style sheet for the print purpose by which you can hide those element which are not required. For this you require to use attribute

media = print

of the STYLE element. Following is small code for this issue

<style media="screen">

  .noPrint{ display: block; }

  .yesPrint{ display: block !important; }

</style>

<style media="print">

  .noPrint{ display: none; }

  .yesPrint{ display: block !important; }

</style>

or when you linking style sheet

<link css="" href="ScreenStyleSheet.css" media="screen" rel="stylesheet" type="" text="">

<link css="" href="PrintStyleSheet.css" media="print" rel="stylesheet" type="" text="">

Using media type as print you can print only those element that you want. Even you can print element with the different style

Have a nice day... 'N happy Coding :)