Bonjour à tous,


J'extrais des données d'une base de donnée et je dois imprimer le résultat sur deu papier.
Le problème que ce imprime que sur une page. Tout ce qui devrait apparaitre sur la deuxième page, est invisible.

J'ai essayé plusieurs truc comme par exemple:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
@media print {
  html, body {
    width: 210mm;
    height: 297mm;
    background-color: #fff;
  }
  pre{
  	border:none;
  	font-size: 8px;
 
  }
  .div-table-body{
  	page-break-after:auto;
  }
  .div-table-heading{
  	display:table-header-group;
  }
  .div-table-row{
  	page-break-inside:avoid; page-break-after:auto;
  }
  .div-table-col{
  	page-break-inside:avoid; page-break-after:auto;
  }
}
(et d'autres varainates)
mais sans succès.

J'ai actuellement un tableau qui est faire de la sorte (bootstrap)

Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<div class="div-table" id="listLables">
  <div class="div-table-heading">
    <div class="div-table-row">
      <div class="div-table-col">1</div>
      <div class="div-table-col">2</div>
      <div class="div-table-col">3</div>
    </div>
 </div>
  <div class="div-table-body">
    <div class="div-table-row">
      <div class="div-table-col">11</div>
      <div class="div-table-col">22</div>
      <div class="div-table-col">33</div>
    </div>
 
...
 
 
<div class="div-table-row">
      <div class="div-table-col">11</div>
      <div class="div-table-col">22</div>
      <div class="div-table-col">33</div>
    </div>
  </div>
</div>

J'aimerais, que lors de l'impression, le "tableau" soit coupé au niveau de la class div-table-row

Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
<div class="div-table-body">
    <div class="div-table-row">
      <div class="div-table-col">11</div>
      <div class="div-table-col">22</div>
      <div class="div-table-col">33</div>
    </div>
<!-- prochaine page papier-->
    <div class="div-table-row">
      <div class="div-table-col">11</div>
      <div class="div-table-col">22</div>
      <div class="div-table-col">33</div>
    </div>
</div>

Pourriez-vous m'aider à faire en sorte que mon tableau s'imprime sur toutes les pages et que s'il devait être coupé sur une autre page, ça serait avant une class div-table-row

Je vous remercie et tout bonne fin d'après midi

peut occuper 2-3 pages