CSS Print Framework

If you want to improve your layouts for printing, this mini CSS Framework will definitely assist you.

What is a CSS Framework?

“A CSS framework is a library that is meant to allow for easier, more standards-compliant styling of a webpage using the Cascading Style Sheets language. Just like programming and scripting language libraries, CSS frameworks package a number of ready-made options for designing and outlaying a webpage.” – Wikipedia

One of the cool things in this CSS you can find on line 27/28. This part will grab all links of the document and append the URL to the link-names.

[ad name=”Adsense – text only”]

The Source:

body {
width:100% !important;
margin:0 !important;
padding:0 !important;
line-height: 1.4;
letter-spacing:0.2pt; font-family: Garamond,"Times New Roman", serif; color: #000; background: none; font-size: 12pt;

/*Headings */
h1,h2,h3,h4,h5,h6 { font-family: Helvetica, Arial, sans-serif; }

code { font: 10pt Courier, monospace; }
blockquote { margin: 1.3em; padding: 1em;  font-size: 10pt; }
hr { background-color: #ccc; }

/* Images */
img { float: left; margin: 1em 1.5em 1.5em 0; }
a img { border: none; }

/* Links */
a:link, a:visited { background: transparent; font-weight: 700; text-decoration: underline;color:#333; }
a:link[href^="http://"]:after, a[href^="http://"]:visited:after { content: " (" attr(href) ") "; font-size: 90%; }
a[href^="http://"] {color:#000; }

/* Table */
table { margin: 1px; text-align:left; }
th { border-bottom: 1px solid #333;  font-weight: bold; }
td { border-bottom: 1px solid #333; }
th,td { padding: 4px 10px 4px 0; }
tfoot { font-style: italic; }
caption { background: #fff; margin-bottom:2em; text-align:left; }
thead {display: table-header-group;}
tr {page-break-inside: avoid;}

/*hide various parts from the site

#header, #footer, #navigation, #rightSideBar, #leftSideBar


To use this Framework, just attach it to your header and choose “print” as media-type.

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

via hartija at Google Project Hosting.

1 comment

Leave a comment

Your email address will not be published.