How to print inline CSS styles?

css, inline, printing

Solution

See the Demo: http://jsfiddle.net/rathoreahsan/x69UY/

What do you think if you do like this:

<div id="printableDiv">
    <style type="text/css">
        @media print {
            #printable { 
               color: red; 
               // Any Other style you want to add 
             }
        }
    </style>
    <div id="printable">
        This Text will print in red color.
    </div>
</div>

Javascript/jQuery code:

w=window.open();
w.document.write($('#printableDiv').html());
w.print();
w.close();

In this scenario while a popup opens and gets the HTML of `printableDiv`, the styles for printer will be included in that popup so the printer will read styles from popup and will print in that manner.

Problem

is there a way to print css styles, that are inline? I use this code to print part of the code: ``` w=window.open(); w.document.write($('#printable').html()); w.print(); w.close(); ``` I could use external file and make it media=print, but part of the html are chars, that are generated by php and I could make it by making class for every posible outcome, but that would be pain. Any ideas? Thanks.

Original source