How to print a specific element

[jordan6]

I need to print a specific element in the page (an image) without the header, left nav, right nav, footer etc.
Can anyone provide the CSS and html/JS/php ?

Thanks

[rtrethewey]

The simplest approach is probably to use a separate stylesheet for media="print" and set everything to "display:none" except that portion of the page you want printed. Of course, you can use additional CSS settings for the printed elements as needed. But this is a good way to start.

[jedaisoul]

rtrethewey's answer is basically correct, but there is a problem you should be aware of: IE7 and IE8 ignore the media="print" statement so will not behave as expected. Despite being obsolete, they still account for 16% of global web usage, so they need to be taken into account.

This is particularly a problem if you not only want to suppress non-print parts of the page, but also add print-specific elements. There are a variety of solutions, my point is to mention the need to test your chosen solution on IE8, as well as compatible browser(s). That's basic quality testing I know, but I thought it worth mentioning.