Aller au contenu
  • Pas encore inscrit ?

    Pourquoi ne pas vous inscrire ? C'est simple, rapide et gratuit.
    Pour en savoir plus, lisez Les avantages de l'inscription... et la Charte de Zébulon.
    De plus, les messages que vous postez en tant qu'invité restent invisibles tant qu'un modérateur ne les a pas validés. Inscrivez-vous, ce sera un gain de temps pour tout le monde, vous, les helpeurs et les modérateurs ! :wink:

CSS et impression


le Visiteur

Messages recommandés

Bonjour,

 

J'ai une page générée dynamiquement qui tient le plus souvent sur une seule page à l'impression.

Parfois ce n'est pas le cas et j'aimerais alors que le dernier élément (un tableau) soit précédé d'un saut de page au lieu de s'imprimer en partie sur la première page, et la suite dans l'autre.

 

J'ai fait appel à toutes les valeurs possibles de page-break-before sans succès. Y a t'il une solution ?

 

Merci.

Lien vers le commentaire
Partager sur d’autres sites

http://www.w3.org/TR/REC-CSS2/page.html#page-break-props

D'après ces specs de CSS2, ton tableau doit porter l'information de style "{ page-break-before: always; }" si tu veux forcer le saut de page systématique, sinon il faut utiliser "{ page-break-inside: avoid; }" si tu ne veux pas que ton tableau se retrouve "coupé" à l'impression (donc qu'il reste entier sur la première page, ou s'il ne tient pas, qu'il reste entier mais tout seul sur la seconde page)

 

Quelles combinaisons as-tu testées et quels furent les résultats obtenus ? (parce que là tu ne nous éclaires pas vraiment sur ce que tu as tenté...)

Lien vers le commentaire
Partager sur d’autres sites

Salut,

 

Merci pour ta réponse. J'avais donc parcouru les spécifications CSS2 et découvert les deux propriétés que tu me proposes. Malheureusement aucune des valeurs possibles ne permet d'éviter que le tableau soit coupé.

En revanche le saut de page forcé fonctionne, mais bon ça m'arrange pas trop vu que dans la mesure du possible tout doit tenir sur une seule page.

 

Actuellement la seule solution que j'ai trouvé est un bouton sur lequel on doit cliquer, caché à l'impression, si l'aperçu du navigateur fait deux pages et qui positionne page-break-before à always ...

 

Je précise que j'ai testé avec IE 6, et Firefox 0.9.1 .

Lien vers le commentaire
Partager sur d’autres sites

Le document à imprimer, de longueur variable, contient plusieurs sections et plusieurs tableaux.

Il peut arriver que le dernier se retrouve à cheval sur une seconde page, ce que je cherche à éviter en forçant un saut de page seulement si nécessaire. Il se trouve malheureusement que les navigateurs actuels n'implémentent pas correctement les propriétés gérant cela (apparemment).

 

En revanche le saut de page systématiquement forcé fonctionne. J'en tire donc parti comme suit : j'ai créé un bouton juste au dessus du dernier tableau, caché à l'impression, qui positionne page-break-before à always pour le tableau. Il s'agit donc pour la personne qui cherche à imprimer de vérifier le nombre de pages occupées par le document via un aperçu navigateur, puis de cliquer sur le bouton s'il est de 2.

 

En fait j'ai substitué une action javascript manuelle à l'action automatiquemt des CSS? Si tu vois une meilleure solution ...

Lien vers le commentaire
Partager sur d’autres sites

Je ne suis pas certain de bien voir quels problèmes cela pose, étant donné que tu ne nous as rien révélé sur la structure de ta page... Tu as un exemple sous la main ?

 

Je suis surpris de voir que le fait de spécifier "page-break-inside: avoid;" sur les tableaux ne les empêche pas de se retrouver à cheval sur plusieurs pages...

Une intervention manuelle, c'est quand même pénible !

Lien vers le commentaire
Partager sur d’autres sites

Tout à fait d'accord pour la pénibilité d'une action manuelle, ce dont j'aimerais m'affranchir. Quant à un exemple, en voici un très simple :

 

<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>
<script language="JavaScript">
for(i=0;i<50;i++){
document.write("aaaaaaaaaaaaaaaaaaaafffffff ffffffffd dddddddd<br>")
}
</script>
<div style="page-break-inside: avoid;">
<table border="1" cellpadding="5" cellspacing="5" bordercolor="#000000" style="page-break-inside: avoid;">
 <tr>
   <td width="1">zzz</td>
   <td width="7">eeee</td>
 </tr>
 <tr>
   <td>dd</td>
   <td>dcc</td>
 </tr>
 <tr>
   <td>;;;;</td>
   <td>eee</td>
 </tr>
 <tr>
   <td>,,,</td>
   <td>,</td>
 </tr>
 <tr>
   <td>lllll</td>
   <td>!!!!!!</td>
 </tr>
</table>
</div>
</body>
</html>

 

Tu noteras que j'ai même encapsulé le tableau dans un div et doublé l'instruction de style au cas où ... Comme je le disais ni IE ni Firefox ne conserve le tableau intact :P

Lien vers le commentaire
Partager sur d’autres sites

Rejoindre la conversation

Vous pouvez publier maintenant et vous inscrire plus tard. Si vous avez un compte, connectez-vous maintenant pour publier avec votre compte.
Remarque : votre message nécessitera l’approbation d’un modérateur avant de pouvoir être visible.

Invité
Répondre à ce sujet…

×   Collé en tant que texte enrichi.   Coller en tant que texte brut à la place

  Seulement 75 émoticônes maximum sont autorisées.

×   Votre lien a été automatiquement intégré.   Afficher plutôt comme un lien

×   Votre contenu précédent a été rétabli.   Vider l’éditeur

×   Vous ne pouvez pas directement coller des images. Envoyez-les depuis votre ordinateur ou insérez-les depuis une URL.

  • En ligne récemment   0 membre est en ligne

    • Aucun utilisateur enregistré regarde cette page.
×
×
  • Créer...