Print only jQuery UI Dialog Content

Question

I have a modal form, which opens on click of button. it contains text I want to print.

I have hidden every other elements in print.css except the div which contains my print data. when I press ctrl + p it shows only the data I wanna print, just as I wanted it to be, but it does not fit the printing A4 page. text is positioned in left top corner of paper and part of it (right side) is hidden.

I tried every possible style in print.css to make the content fit printable area, but nothing changes :( could anyone please help?

Does this answer your question? [Print
only?](https://stackoverflow.com/questions/468881/print-div-id-printarea-div-only) — Heretic Monkey, Feb 03 '20 at 20:42

score 0 · Answer 1 · edited May 23 '17 at 11:49

0

Use something like:

@media screen {
    .printable { display: none; }
    .non-printable { display: block; }
}
@media print {
    .printable { display: block; }
    .non-printable { display: none; }
}

and set margin for your page in the print state.

Also check my answer and jsFiddle here

edited May 23 '17 at 11:49

Community

1
1

answered Nov 14 '14 at 01:19

Lior Elrom

19,660
16
80
92

Print only jQuery UI Dialog Content

1 Answers1