How to print a portion of an HTML page?

css, html, printing

Solution

You should use a separate css for the print media. This allows you to hide/show portions of the page when it gets printed.

html :

<div class="dont-print-that">
   blah
</div>
print this!

include:

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

print.css

.dont-print-that{display:none;}

The other solution is to open a new window with only the content you want to print. You could either do that in a popup or an iframe. Personally I find the CSS solution more elegant, but that's up to you.

Problem

I have an html page i want to print a portion of this html page, I know a javascript function to print a page, ``` onClick="javascript:window.print(); return false; ``` but how can I print a portion of a page? If anyone has an idea, please share it with me.

Original source