Print a div with CSS
<p>I've been searching alot for print a div with the CSS, but i didn't get the output that i want, i don't know why.</p>

<p>Here's the trigget to show the print popup:</p>

<pre><code>    &lt;button id="print" onclick="Popup('front')"&gt;HERE&lt;/button&gt;
</code></pre>

<p>Here's my script:</p>

<pre><code>    function Popup(data) {

    var div = document.getElementById(data).innerHTML;

    var mywindow = window.open('', 'new div', 'height=400,width=600');
    mywindow.document.write('&lt;html&gt;&lt;head&gt;&lt;title&gt;&lt;/title&gt;');
    mywindow.document.write( "&lt;link rel=\"stylesheet\" href=\"ficha-tecnica-media.css\" type=\"text/css\" media=\"print\"/&gt;" );
    mywindow.document.write('&lt;/head&gt;&lt;body &gt;');
    mywindow.document.write(div);
    mywindow.document.write('&lt;/body&gt;&lt;/html&gt;');

    mywindow.print();
    mywindow.close();

    return true;
}
&lt;/script&gt;
</code></pre>

<p>And in my <code>ficha-tecnica-media.css</code>:</p>

<pre><code>@media print {
    body{
        font-family: Arial, Helvetica, sans-serif;
    }
    table{
                font-size: 10px;
    }

    article{
                font-size: 10px;
    }
    img{
        width: 50px;
        height: 50px;
    }
}
</code></pre>

<p>If i put a <code>display:none</code> on <code>img</code> it works, but im trying to resize it, but it doesn't work. The <code>font-family</code> in body or <code>font-size</code> also don't work.. why?</p>