Forum Programmation.web Impression + css +table +saut de page

Posté par  (site web personnel, Mastodon) .
Étiquettes : aucune
0
9
oct.
2004
Bonjour,

Je suis entrain de coder un annuaire en php + mysql.
Le tout fonctionne bien,

Maintenant je suis entrain d'écrire la feuille de style pour l'impression,
en fait le but est d'imprimer une liste de tous les entrées sous forme d'un tableau.
Le tableau déborde sur plusieurs page (il y a pas mal d'entrée).

Lorsque que j'imprime Mozilla donc me découpe le tableau en plusieurs page, le
problème c'est que sur chaque nouvelle page la bordure du haut de la première
série est absente. Ce qui est normal vus que j'ai fusionner mes bordures.

Ma question est: Comment faire pour que cette foutue ligne vient (en haut de la première ligne de la deuxième page.)?
Peut on faire que le navigateur reporte les cellules th en haut de chaque nouvelle page ?

voici mon fichier print.css:
.liste table {
width: 100%;
border: thin solid black;

border-collapse: collapse;

}

.liste td, th {
border: thin solid black;
padding: 3px;
font-size: 10px;
}

Je vous remercie d'avance

  • # Aucune réponse à ce problème...

    Posté par  . Évalué à 1.

    Ni de la part des autres, ni de ma part, dommage, car j'aurais été intéressé par une éventuelle réponse.
    Quoi qu'il en soit, je pense tout simplement que ce n'est pas faisable, du moins pas comme ça. A mon avis, il faut complexifier un peu la chose et passer par xml+xslt pour obtenir ce que tu veux. Suivant le média, tu parse ton xml avec la feuille de style qui va bien... Evidement, c'est plus de boulot que ce qui est prévu au départ, mais je ne vois pas comment procéder autrement....
    Une autre idée : enfermer les th dans un div de position : fixed... J'ai pas essayé, alors merci de pas taper si c'est pas bon, c'est juste une idée en passant.
    Pour ce que j'ai pu constater sur le site du w3c, on peut mettre les définitions de styles dans le même fichier css, en carrant le tout dans une définition un peu bizare que je ne connaissait pas :
    @media screen { ... }
    @media print { ... }
    @media screen, print { ... }
    Remplacer les { ... } par les définitions classiques du css. La première ligne fera les définitions pour l'affichage écran, la seconde pour l'impression, et la dernière pour les parties communes. Plus d'infos ici : http://www.w3schools.com/css/css_mediatypes.asp(...)

    On doit pouvoir s'en sortir également en utilisant ce genre de choses :
    les pseudos-éléments commé définis ici :
    http://www.w3schools.com/css/css_pseudo_elements.asp(...)
    Je pense notemment au :before, et :after, par exemple....
    Bien sûr ce ne sont que des pistes. J'ai juste un peu cherché, mais par manque de temps, je ne suis pas allé au bout de la solution. Si jamais tu trouves, tiens nous au courant !

Suivre le flux des commentaires

Note : les commentaires appartiennent à celles et ceux qui les ont postés. Nous n’en sommes pas responsables.