Formatage html pour l'impression

Discussion dans 'Développement d'un site Web ou d'une appli mobile' créé par xdeslandes, 22 Septembre 2005.

  1. xdeslandes
    xdeslandes WRInaute occasionnel
    Inscrit:
    29 Décembre 2004
    Messages:
    330
    J'aime reçus:
    0
    Bonjour !
    Je développe une application qui doit entre autres, générer des étiquettes afin qu'elles soient imprimées sur un papier adhésif, dont le format est bien déterminé.
    Mon appli php génère donc en html des tableaux contenant tout un tas d'informations. Ces tableaux html sont formatés avec un
    Code:
    <link rel="style.css" media="print">
    Un aperçu avant impression me confirme qu'ils apparaissent bien.
    Mon pb est le suivant : mes étiquettes papier font 62 mm de hauteur. Comment régler la hauteur d'un tableau pour qu'à l'impression, il fasse également 62 mm de hauteur ? La résolution de l'écran utilisé n'entre-t-elle pas en ligne de compte ? Faut-il régler sa hauteur avec un bon vieil attribut html height="200" ou utiliser une unité de mesure px, em, ou autre en css ? Comment faire pour qu'en cas de texte trop important on "bloque" la hauteur fixée ?
    Merci des tuyaux !
     
  2. blman
    blman WRInaute accro
    Inscrit:
    5 Septembre 2003
    Messages:
    2 719
    J'aime reçus:
    3
  3. SIBELIUS
    SIBELIUS WRInaute occasionnel
    Inscrit:
    21 Décembre 2003
    Messages:
    256
    J'aime reçus:
    0
    Si tu ne précises pas l'unité, comme dans ton exemple, il va automatiquement choisir - à tort - le pixel.
    Or "mm" est une unité tout à fait valable et conseillée pour le média print. Donc height="200mm" convient.

    Cependant, il faut toujours avoir conscience que la hauteur d'un tableau est dépendante de celles de ses cellules. Il faudrait donc fixer la hauteur de chaque cellule.

    Pour gérer les "dépassement", je pense que le mieux est de voir du côté de la propriété CSS "overflow".

    Bonne chance :)
     
  4. xdeslandes
    xdeslandes WRInaute occasionnel
    Inscrit:
    29 Décembre 2004
    Messages:
    330
    J'aime reçus:
    0
    Merci !
    Je crois que je vais me pencher sur la solution purement css, car, même si les classes sont un outil formidable, je ne suis pas sûr que celle-ci me convienne. En effet, mes tableaux contiennent beaucoup d'infos, celles-ci sont disposées très précisément les unes par rapport aux autres, et il y a jusqu'à trois pictogrammes dessus.
    @Sibelius : mon attribut height était dans la balise html, mais je crois que tu as raison, je vais régler la hauteur du tableau dans le css afin d'utiliser le mm comme unité. Que me conseilles-tu d'aller voir pour la règle css overflow ?
     
  5. medium69
    medium69 WRInaute passionné
    Inscrit:
    7 Mai 2005
    Messages:
    1 940
    J'aime reçus:
    3
    Tu devrais faire une recherhce sur Google et peut-être encore mieux sur Alsacréation.

    Tu as la possibilité de définir le format d'une page pourl'impression, --> certainement pour une étiquette.

    La feuille CSS géré pour l'impression, tu la gère comme cela dans tes meta :
    Code:
    <link rel="stylesheet" type="text/css" media="print" href="tonFichier.css" />
    J'utilise déjà ce principe pour l'impression des pages de mon site.

    Si tu veux voir ce que cela donne, vois l'aperçu avant impression de ma page d'accueil par exemple.

    Ce n'est qu'un petit aperçu de ce qu'il est possible de faire.
     
  6. xdeslandes
    xdeslandes WRInaute occasionnel
    Inscrit:
    29 Décembre 2004
    Messages:
    330
    J'aime reçus:
    0
    Merci medium69 ! Mais mon problème est bien plus complexe que cela :wink: . Je désire que la hauteur et largeur de mon tableau soient TOUJOURS celles de mes étiquettes papier, qu'il y ait 4 étiquettes par page, et qu'elles ne soient pas coupées si on lance une impression de plus de quatre étiquettes (souvent 50 ou 100 d'ailleurs).
     
  7. xdeslandes
    xdeslandes WRInaute occasionnel
    Inscrit:
    29 Décembre 2004
    Messages:
    330
    J'aime reçus:
    0
    J'ai fait cela :
    Code:
    <table class="etq">
    mon étiquette
    </table>
    
    Et dans mon fichier css,
    Code:
    table.etq {border: 1px solid black; padding: 0; height: 58mm; page-break-inside: avoid;}
    
    afin qu'une étiquette ne soit pas coupée à la fin d'une page à l'impression (du moins c'est ce que je crois que cette propriété css fait !). Mais rien n'y fait : j'ai une étiquette (la 5ème) qui est coupée en bas de page lorsque je fait "aperçu avant impression".
    Qu'en pensez vous ?
     
Chargement...
Similar Threads - Formatage impression Forum Date
Formatage de l'API Reference de Stripe. e-commerce 25 Septembre 2017
Formatage url rewriting Référencement Google 25 Novembre 2016
Formatage des balises h1, h2, h3, p, etc Développement d'un site Web ou d'une appli mobile 23 Juillet 2012
Formatage de l'URL incluse entre les balises <loc> et </loc> Débuter en référencement 27 Janvier 2012
Probleme de formatage disque dur ntfs vers FAT32 Le café de WebRankInfo 9 Octobre 2011
PHP : formatage spécial Développement d'un site Web ou d'une appli mobile 21 Septembre 2010
Problème après reformatage complet du site Crawl et indexation Google, sitemaps 3 Août 2009
Script de formatage ponctuation Développement d'un site Web ou d'une appli mobile 7 Novembre 2008
[CSS] Formatage de liens de différents styles Développement d'un site Web ou d'une appli mobile 30 Novembre 2007
formatage date Développement d'un site Web ou d'une appli mobile 25 Novembre 2007
Formatage des URLs d'Ebay Problèmes de référencement spécifiques à vos sites 24 Avril 2007
Problème de formatage des décimales Développement d'un site Web ou d'une appli mobile 2 Février 2006
C'est quoi le formatage exacte pour l'europe ? UTF-8 ? Administration d'un site Web 25 Octobre 2005
Search Console Forte augmentation des impressions alors que les positions s'effrondrent (sur 24h) Crawl et indexation Google, sitemaps 8 Avril 2022
Search Console amélioration du positionnement mais baisse d'impressions Débuter en référencement 23 Juillet 2021
Peu d’impressions sur Google.. Débuter en référencement 5 Juillet 2021
Google News / actualités : pas d'impression Référencement Google 22 Avril 2021
Search Console Impressions venant d'autres pays Crawl et indexation Google, sitemaps 14 Avril 2021
Baisse CTR de page et CTR impressions AdSense AdSense 14 Août 2020
Attaque negative SEO provoque chute de 50% des impressions ? Référencement Google 31 Juillet 2020