Comment les propriétés de saut de page en CSS sont-elles censées fonctionner?

Question

Les navigateurs modernes sont supposé prendre en charge les propriétés de saut de page CSS dans une certaine mesure. Cependant, aucun navigateur n'a pu imprimer différemment lorsque j'utilise eviter , veuves ou orphelins . Est-ce que je me trompe ou le support du navigateur n'est-il pas aussi solide que celui annoncé?

      h2 {
        page-break-after: avoid;
      }                         

      p {
        page-break-inside: avoid;   
        orphans: 2;
        widows: 2;
      }

Answer 1

Le support du navigateur pour l'impression est nul. Pas juste un petit peu, mais complètement et sans comparaison. À peu près une fois tous les deux ans (depuis 10 ans), j'ai joué avec cela et je reviens toujours à la même conclusion: ne comptez pas sur le navigateur pour gérer correctement les impressions.

S'il doit absolument être positionné correctement, créez un fichier pdf à la volée et laissez-le imprimer.

Answer 2

Si vous voulez faire un saut de page, je sais que c'est comme ça que ça marche, du moins dans Firefox et IE. La dernière fois que j'ai vérifié cela fonctionnait dans IE7.

Page 1

<br style="page-break-after:always" />

Page 2

Il devrait imprimer les pages sur des feuilles de papier séparées, totalement selon le navigateur.

Answer 3

Je sais que cela ira à l'encontre de tout ce que tout le monde dit sur le développement HTML, mais utilisez des tableaux . Placez le contenu qui doit rester ensemble dans un tableau. La page ne sera pas divisée au milieu du tableau. Si le tableau comporte plus d'une page, il sera divisé quelque part au milieu du tableau, mais l'utilisation de tableaux est un bon moyen de conserver le contenu ensemble lors de l'impression.