28172 sujets

CSS et mise en forme, CSS3

[Résolu] CSS print entete de tableau seulement sur 2de page

J'ai une page html avec un fichier css pour l'impression correcte des informations.
Ma page contient plusieurs tableaux, titres et paragraphes.
J'ai un problème avec l'impression car lorsqu'un tableau est situé au bas d'un page, et qu'il est trop grand pour y être affiché entièrement, le tableau est coupé et l'entête est dupliquée sur les 2 pages. La 1ere page contient donc l'entête et la 2eme page contient tout le tableau.

Je cherche un moyen afin que l'entête d'un tableau apparaisse sur une page uniquement si le corps du tableau peux s'afficher un minimum.

J'ai essayé ces règles css mais ceci ne correspond à mes besoins:

table { page-break-inside:auto !important; }
tr    { page-break-inside:avoid !important; page-break-after:auto !important; }
thead { display:table-header-group !important; }
tfoot { display:table-footer-group !important; }


J'ai également essayé ceci mais cela ne fonctionne pas dans EDGE:

table {
    overflow: hidden !important; 
    height: auto !important; 
    page-break-after: avoid !important; 
    page-break-before: avoid !important; 
    page-break-inside: avoid !important;
}       
table:last-child {
    page-break-after: auto !important; 
}


Pourriez-vous m'aider s'il vous plaît ?

Merci d'avance
Modifié par coeurdange57 (17 Nov 2020 - 12:00)
Modérateur
Bonjour,

Ces propriétés css sont encore fortement boguées en 2020, même dans des cas relativement simples, et cela dépend beaucoup des navigateurs.

En particulier, page-break-before:avoid et page-break-after:avoid fonctionnent très mal.

Voir https://caniuse.com/?search=page-break

Selon moi, ce serait un coup de chance si ce que tu envisages arrivait à fonctionner.

EDIT: mon conseil est de ne jamais couper un tableau en 2.

Amicalement,
Modifié par parsimonhi (17 Nov 2020 - 12:20)
Sujet clos
Aller à