I cannot print a page with Style in SharePoint. Please take a look on two images below. I've added the `media="all"` or `media="print"` into `<style type=text/css>` but these didn't work.

* **The screen before printing**

![1](https://i.stack.imgur.com/6Tznk.png)

* **Wait for clicking Print button**

![2](https://i.stack.imgur.com/uU3El.png)

**HTML:**

```
<input onclick="printDiv('page_printer');" type="button" value="Print" style="font-family: Verdana,Arial,sans-serif !important; font-size: 8pt !important; width: 150px !important;"></input>
<table id="page_printer">
<tr>
    <td>
        <table border="0" cellspacing="0" width="100%">
            <tr>
                <td>
                    <fieldset class="box">
                        <legend class="text_transportation">EMPLOYEE GATE PASS</legend>
                        <table>
                            <tr>
                                <td width="190px" valign="top" class="ms-formlabel">
                                    <h3 class="ms-standardheader">
                                        <nobr>Date</nobr>
                                    </h3>
                                </td>
                            </tr>
                        </table>
                    </fieldset>
                </td>
            </tr>
        </table>
    </td>
</tr>
</table>

```

**CSS:**

```
.ms-bodyareaframe {
    padding: 8px;
    border: none;
}
.text_transportation {
    font-size: large;
    color: red;
}
.text_approveStep {
    font-size: small;
    color: red;
}
.box {
    width: 750px !important;
}
.set_width {
    width: 350px !important;
}
.set_backgr {
    text-decoration: none !important;
    color: #0072BC !important;
    font-family: Verdana, Arial, sans-serif !important;
    border: none !important;
    background-color: #F6F6F6 !important;
}
.set_backgr:hover {
    text-decoration: none !important;
    cursor: pointer;
}
.readOnly {
    background-color: #F6F6F6 !important;
    color: #676767 !important;
    border: none !important;
    cursor: default;
}

```

**Javascript:**

```
   function printDiv(divID) {
    //Get the HTML of div
    var divElements = document.getElementById(divID).innerHTML;
    //Get the HTML of whole page
    var oldPage = document.body.innerHTML;

    //Reset the page's HTML with div's HTML only
    document.body.innerHTML =
        "<html><head><title></title></head><body>" + divElements + "</body>";

    //window.print();
    //document.body.innerHTML = oldPage;

    //Print Page
    setTimeout(function () {
        print_page();
    }, 2000);

    function print_page() {
        window.print();
    }

    //Restore orignal HTML
    setTimeout(function () {
        restore_page();
    }, 3000);

    function restore_page() {
        document.body.innerHTML = oldPage;
    }
}

```