28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je ne veux pas couper mon tableau lorsque j'imprime. J'ai essayé différentes façon avec cette propriété, mais sans succès.

Est-ce qu'il y a une façon de réussir?


table {page-break-inside: avoid;}
tr {page-break-inside: avoid;}
th, td {page-break-inside: avoid;}

Modifié par britanicus75 (16 Jan 2010 - 23:31)
Bonne nuit,

Pour l'impression de ton tableau, ça me fait penser à ce topic :
block break indésirables à l'impression Il faut que tu comprennes bien une chose ; les règles véritables et les indications bidon CSS : règle @page et propriété "page-break-inside" (<--c'est quoi ce truc ?) font partie de la branlette d'esprit. Pour l'impression, il est impossible de formater quoique ce soit (je parle de format et non d'apparence). Il est par exemple impossible d'obliger l'imprimante, par le biais de ta CSS, à imprimer la page web en format "paysage" si tu es réglé en "portrait". De même pour les marges. Ainsi ces deux formules idylliques qui datent de 2008 ne fonctionnent toujours pas en 2010 :
@page {size: 21cm 29.7cm; margin: 2cm }
@page {size: portrait } /*ou landscape */

Que l'on ajoute des arguments très compliqués comme "page-break-inside" à des des concepts qui n'existent pas… ça me fait bien rigoler.
Aureance a écrit :
"page-break-inside" (<--c'est quoi ce truc ?)

RTFM: http://www.w3.org/TR/CSS2/page.html#propdef-page-break-inside

Aureance a écrit :
Il est par exemple impossible d'obliger l'imprimante, par le biais de ta CSS, à imprimer la page web en format "paysage" si tu es réglé en "portrait". De même pour les marges.

(Pas tout à fait, mais...) Ce n'est pas le sujet. On parle de page-break-inside, qui présente des défis d'implémentation bien différents.

Aureance a écrit :
Que l'on ajoute des arguments très compliqués comme "page-break-inside" à des des concepts qui n'existent pas… ça me fait bien rigoler.

Il serait préférable d'utiliser des mots précis. Parler de «concept» pour la règle @page et propriétés size et margin dans le contexte de cette règle, d'«arguments très compliqués» pour une simple propriété CSS (page-break-inside), et dire que les «concepts» n'existent pas alors qu'on n'a pas vérifié l'état des implémentations (ou qu'on n'en dit rien)... ça n'apporte pas grand chose.

Et donc, pour se concentrer sur le support de la propriété page-break-inside:
- http://msdn.microsoft.com/en-us/library/cc304082%28VS.85%29.aspx (support de page-break-inside ajouté à IE8);
- tr {page-break-inside: avoid;} semble supporté par Opera depuis des lustres (une source);
- du côté de Webkit par contre, ça a l'air d'être en jachère (voir bugzilla Webkit);
- même topo chez Mozilla (bug 115199 et bug 132035.

Comme quoi, IE8 a un meilleur support de CSS que Firefox, Safari et Chrome. Smiley lol
Florent V. a écrit :

Comme quoi, IE8 a un meilleur support de CSS que Firefox, Safari et Chrome. Smiley lol

J'adore l'émoticône verdâtre.

Donc pour imprimer correctement les documents de britanicus75 il faudra acheter un PC ? (c'est cool, ce sera l'extension de mon imprimante). Je crois que fournir un fichier .pdf serait mieux venu, ça se fait de plus en plus. On peut aussi générer les .pdf à la volée grâce à PHP.

Plus sérieusement à Florent V.
Il existe un lien concernant les capacités de WebKit et je ne pense pas que tu l'ignores : En avance sur le temps WebKit vous indique toutes les possibilités CSS mises à votre disposition. Il sera intéressant de voir vers le bas de page tout ce qui concerne les choses comme -webkit-column- qui je crois, répondrons à la demande de ne pas couper les tableaux à l'impression.

<edit
Tous tes liens sont édifiants pour les personnes qui comprennent la langue de « j'Expire » sauf moi.
En langue de Molière :
Version francisée des recommandations W3C pour les médias paginés
/>
Modifié par Aureance (17 Jan 2010 - 21:09)
-webkit-column-break-inside a l'air intéressant. Par contre c'est un mécanisme propriétaire non documenté dans CSS 2.1 ou un module CSS 3, si je comprends bien la doc.
Quant au support de page-break-inside, il est annoncé comme ok depuis Safari 1.3, mais j'ai quelques doutes là-dessus vu que des articles que j'ai trouvé datant de l'époque de Safari 2 ou Safari 3 disent que niet. Smiley ohwell