0

I have a page which has 2 css in the header:

<link type="text/css" rel="stylesheet" href=<?= $theme_url ?>/css/page-kitchen.css">
<link type="text/css" rel="stylesheet" href=<?= $theme_url ?>/css/page-kitchen.css" media="print">

and 2 script file:

<script type="text/javascript" src="<?= $theme_url ?>/js/jquery.min.js"></script>
<script type="text/javascript" src="<?= $theme_url ?>/js/kitchen.js"></script>

And I have a print <img> tag which calls onclick the print event:

<img src="<?= $site_url ?>/wp-content/uploads/printer.png" alt="Print page" onclick="printDiv('#body-print');" style="cursor: pointer; width: 5%; height: 5%;"></img>

which print's the page #body-div content.

It opens the printer page but doesn't add the default css files. Here is my js file:

function printDiv(divName) {
    var printContents = document.getElementById(divName).innerHTML;
    var originalContents = document.body.innerHTML;

    document.body.innerHTML = printContents;

    window.print();

    document.body.innerHTML = originalContents;
}

I've tried to append the css file but can't made too far. Checked this and this solutions from the site but none of them worked for me.

DesignButtonElement
  • 19
  • 7
  • Have you added the `` to the print stylesheet in the print div? – Technohacker Feb 18 '18 at 11:58
  • When you linked your stylesheets, you forgot to put quotes around the `href`s. Also, they both link to the exact same file. I don't know if this is a mistake you made while copy/pasting your code here, so let's get that out of the way first. Also, make sure you open your developer console (F12) and look for any errors (404 maybe?). – blex Feb 18 '18 at 12:00
  • @K3v1n As I see on this page I've tried to insert this with good link `$('').appendTo('head');` but not worked – DesignButtonElement Feb 18 '18 at 12:01
  • @blex Yes, I've tried to force one css only for media = "print" and it's the same file as well. No it's not a mistake I've tried some solutions but none of them worked for me – DesignButtonElement Feb 18 '18 at 12:03

1 Answers1

0

I think the problem is in css structure that applies style using subclasses (.divclass.subdivclass)

when you move div content to body, it takes its content and moves it to body getting rid of the parent div.

radu706
  • 28
  • 4