< Back to Coding, HTML

Print CSS

Here is a some default print css to get started.

@media print {
 * {
 background: #fff none !important;
 color: #000 !important; }

a:after {
 content: " (" attr(href) ") ";
 font-size: 0.8em;
 font-weight: normal;
 /* wrapping required for windows 8 phone and ie10,11 */
 -ms-word-break: break-all;
 word-break: break-all;
 display: inline-block;
 /* Non standard for webkit */
 word-break: break-word;
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto; }
}

The bottom code prints out the url after any links and makes it wrap so it doesn’t break the layout.

 

Be Sociable, Share!

Leave a Reply

Your email address will not be published. Required fields are marked *