Advanced CSS Design Resources - last-child.com » media http://www.last-child.com CSS Toys for Professional Web Developers Mon, 19 Dec 2011 18:30:15 +0000 en hourly 1 http://wordpress.org/?v=3.1.2 Multiple medias in the print.css http://www.last-child.com/multiple-medias-in-the-printcss/ http://www.last-child.com/multiple-medias-in-the-printcss/#comments Wed, 29 Mar 2006 23:33:37 +0000 Ted http://www.last-child.com/multiple-medias-in-the-printcss/ Let’s say you have a printer-friendly page that consolidates information from multiple sections. The page uses the print.css as all instead of just print. Let’s also assume you want to show things on the screen, such as a link back to the referral page, and different elements on the printed page, such as the url of the referral page.

Simple HTML Example

Go back to the last page.

http://www.last-child.com/multiple-medias-in-the-print.css

CSS solution

You can include multiple medias in one style sheet. Just declare the special rules under @media


@media print{/*show printer only elements, hide screen only elements */
.noprint {display:none;}
.print {display:block;}
}

Your main CSS file would have already declared .print {display:none;}.

]]> http://www.last-child.com/multiple-medias-in-the-printcss/feed/ 0