CSS for printing

9 Mind-Blowing Canvas DemosAs much as I read articles online, I still print a fair amount of them out. Sometimes I print them to pass on to others, other times to read again when I have more time. Unfortunately a great deal of websites put no effort into providing their content in a printer-friendly fashion. The result of them overlooking the print audience is a great article not being read.Create a CSS Flipping Animation If only these writers knew how easy it can be to optimize their site for print and how it can greatly enhance the value of their website.

The secret to creating printable pages is being able to identify and control the "content area(s)" of your website. Most websites are composed of a header, footer, sidebars/subnavigation, and one main content area. Control the content area and most of your work is done.Elegant Overflow with CSS Ellipsis The following are my tips to conquering the print media without changing the integrity of your website.

Create A Stylesheet For Print

Of course you have at least one stylesheet to control the layout of the page and formatting of the content, but do you have a stylesheet to control how your page will look like in print? Add the print style sheet, with the media attribute set to "print", at the end of the list of stylesheets in the header. This will allow you to create custom CSS classes applied only at the time of print. Make sure your structure CSS file is given a media attribute of "all."

Interesting facts
  • In typography, a margin is the space that surrounds the content of a page. The margin helps to define where a line of text begins and ends. When a page is justified the text is spread out to be flush with the left and right margins. When two pages of content are combined next to each other (known as a two-page spread), the space between the two...
You might also like
CSS Tutorial for Beginners - part 1 of 4 - Applying Styles
CSS Tutorial for Beginners - part 1 of 4 - Applying Styles
HTML Tutorial: Formatting Web Pages for Printing
HTML Tutorial: Formatting Web Pages for Printing
CSS Printing
CSS Printing
CSS for Developers Printing with CSS
CSS for Developers Printing with CSS
Custom CSS For Printing WordPress Pages
Custom CSS For Printing WordPress Pages
Related Posts