Discussion :

[nath-0-0]

Bonjour,

Je souhaite éviter que le saut de page se fasse à l'intérieur d0un tr, j'ai donc fait cela:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
tr {
     page-break-inside:avoid; 
}

je souhaiterais aussi que les titres de ma table se répètent sur une nouvelle page, j'ai donc fait ça:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
thead {
    display: table-header-group;
}

mais l'un comme l'autre ne fonctionne pas.

merci d'avance pour votre aise!

Nath

[raydenprod]

pour la première question,La propriété de feuille de style css page-break-inside est une feuille de style de type media="print" voilà pourquoi elle ne fonctionne pas avec un media="screen"

tu as essayé avec un display:none ?

pour la seconde,je ne comprends pas ce que tu veux faire

[nath-0-0]

merci pour la réponse, j'utilise bien une feuille de style de type media="print". cependant avec le page-break-inside, cela ne fonctionne pas, mes lignes sont coupées.
Un display:none ? Mais je veux pas caché mes lignes.

Pour la seconde question, ce que je voudrias c'est répéter sur chaques pages les titres de ma table contenu dans le thead., dans les blaises <th>.

[raydenprod]

tu peux ajouter un petit code sale mais pratique

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<br style="display:none;"/>

Si tu veux être moins creepy tu peux faire ça en jQuery :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
$("br").filter(function() {
 
 return $(this).css("display") == "none" 
})

pour un media print ça pose pas de soucis il me semble

[nath-0-0]

j'utilise un framework, cela ne fonctionne donc pas.
Je comprends pas pourquoi mon :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
tr{
     page-break-inside:avoid;
     page-break-after:auto;
}

ne fonctionne pas, à quoi cela peut être du? je n'ai pourtant aucune autre référence $ un tr dans mon css d'impression.

d'aillerus voici mon css au complet:

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
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
 
/* print.css */
@page {
  size: landscape;   /* auto est la valeur initiale */
   margin: 4px;
  margin-bottom: 10px;
}
 
body {line-height:1.5;font-family:"Helvetica Neue", Arial, Helvetica, sans-serif;color:#000;background:none;font-size:10pt;}
.container {background:none;}
hr {background:#ccc;color:#ccc;width:100%;height:2px;margin:2em 0;padding:0;border:none;}
hr.space {background:#fff;color:#fff;visibility:hidden;}
h1, h2, h3, h4, h5, h6 {font-family:"Helvetica Neue", Arial, "Lucida Grande", sans-serif;}
code {font:.9em "Courier New", Monaco, Courier, monospace;}
a img {border:none;}
p img.top {margin-top:0;}
blockquote {margin:1.5em;padding:1em;font-style:italic;font-size:.9em;}
.small {font-size:.9em;}
.large {font-size:1.1em;}
.quiet {color:#999;}
.hide {display:none;}
a:link, a:visited {background:transparent;font-weight:700;text-decoration:underline;}
/* a:link:after, a:visited:after {content:" (" attr(href) ")";font-size:90%;}*/
 
 
tr{
     page-break-inside:avoid;
     page-break-after:auto;
}
 
 
.grid-view table.items th, .grid-view table.items td {
    border: 0px solid gray !important;
} 
 
td.td550{
    width:550px;
}
td.td125{
    width:125px;
}
 
td.tdHeures{
 text-align: center;
 width:50px;
}
td.tdDate{
    text-align: center;
    width:100px;
}
 
 
/* disable selection for extrarows */     
.grid-view td.extrarow {
   display: none;
}
 
 
div.summary,
.checkbox-column,
.button-column,
div.soustotaux,
div#mainmenu
{
    display: none;
}