Print Friendly CSS
-
Thank you for the lovely theme!
I am trying to create a print friendly css for a install.
I have created print.css ( http://pastebin.com/9wgh7vWk ) and i get full page content of the post only when sidebars are disabled in layout.
If a sidebar is enabled in layout, half of the page is empty and in remaining half only content is being printed.
I would like to know why there is sidebar space is still left empty in the print page, although it is not being displayed. Or if any one had already customised print css, would be able to shed some light.
Any help is appreciated.
@media print {
body {background:white;
font-size:10pt;
margin:0 }
#wrapper { display:block }
.content, .page { width: auto}
#sidebar { display:none }
#nav-topbar { display:none }
#header { height:90px }
#content{ margin-left:0; float:none; width:auto }
#content a { font-weight:bold; color:#000066; text-decoration:underline }
.content .post,
.content .page { margin-left:0;
float:none;
width:100% }
.col-1c .sidebar,
.col-2cl .s2,
.col-2cr .s2 { display: none }
#comments { display:none }
#footer { display:none }
h1, h2, h3, h4, h5, h6 { page-break-after:avoid;
page-break-inside:avoid }
h3 { margin-left:10px;
margin-bottom:0px;
padding-bottom:0px }
.post-tags, .related-posts, .post-nav, .heading, .s1, .s2, .sidebar, .sidebar-content { display:none }
blockquote, table, pre { page-break-inside:avoid }
ul, ol, dl { page-break-before:avoid }
img.centered { display: block;
margin-left: auto;
margin-right: auto; }
img.right { padding: 4px;
margin: 0 0 2px 7px;
display: inline; }
img.left { padding: 4px;
margin: 0 7px 2px 0;
display: inline; }
.right { float: right; }
.left { float: left }
img { page-break-inside:avoid;
page-break-after:avoid; }}
The topic ‘Print Friendly CSS’ is closed to new replies.
