All geek questions in one place

Printing a DIV container without losing CSS styles

After reading several articles, forums, etc., he comes to the point where I come and seek your help.

I am trying to add a "Print" button on a page that, when clicked, prints a table. I tried jqprint (so far the best solution), but it is still wrong:

A page layout is a tab containing an accordion. Inside this accordion is a table with several rows. Each line has hidden divs.

When the user clicks the Print button, hidden divs are displayed, and then jqprint is called to print the table using the identifier as a selector.

In FireFox: When I print to PDF (to save paper and be beautiful with Mother Nature), only the first few rows of the table are printed. Basically, a PDF file will contain many pages, but I get only the first and nothing more.

In Chrome: Doesn't work at all. PDF is not completed.

If you know about a fix for jqprint or have any feedback on this issue, get ahead of time.

Jonathan

+3
source share
3 answers

Styling html for printing is usually achieved using a different stylesheet, for example. in the head element:

<head>
    ...

    <link rel="stylesheet" type="text/css" media="screen" href="style.css">
    <link rel="stylesheet" type="text/css" media="print" href="print.css">
    ...

</head>

style.css html , print.css html . print.css, html .

+3

css , .. print.css, , .

0

printThis .

. ​​

rowspan colspan, , .

$('#table_id').printThis({ pageTitle: $('#report_title').text()});

,

0

Source: https://habr.com/ru/post/1774233/

More articles:


All Articles