print or save to pdf div content  [ 90 views ]

Sometimes we need only a part of a web page to print or to save to pdf. Here is a simple solution:

add these lines to the page stylesheet

@media print {
    body * {
       visibility: hidden;
    }
    #content, #content * {
       visibility: visible;
    }
    #content {
       position: absolute;
       left: 0;
       top: 0;
       padding: 0;
       margin: 0;
    }
}

where the #content is the id of the target DIV.

#sidebar a { color:#fff; } #sidebar ul ul li { color: #DEF585; } #sidebar h2 { color: #fff; } #sidebar ul p, #sidebar ul select { color: #BEDDBE; } #backfly { background: url(images/golfBallWallPaper.jpg) left bottom fixed repeat-x #65a51d; }