webprofi: Ausdruck: Hintergrund erneut wiederholen auf jeder Seite

Hallo,

ich erzeuge in meinem kleinen Buchhaltungssystem (mySQL, PHP, HTML, alles im Firefox) die Rechnungen als HTML-Dokument im Browser. Das klappt soweit ganz gut.

Für den PDF-Export einer Rechnungen habe ich mein Geschäftsbriefpapier per SVG nachgebaut - also Logo, Adressfeld, rechtlich notwendige Angaben in Fusszeile etc. - und das SVG dann als Hintergrund eingebunden. Das SVG ist exakt DIN-A 4 gross. Auch das klappt ganz gut, solange ich nur die erste Seite mit dem Hintergrundbild versehe (css: background-repeat:no-repeat) und den Rest der Rechnung auf blankem Papier drucke.

Wenn ich jetzt versuche, auf jeder Seite das Hintergrundbild zu zeigen (css: background-repeat:repeat-y), also jede Seite der Rechnung auf dem 'Geschäftsbriefpapier' auszugeben, bekomme ich ein Problem.

Der Export als PDF (durch einen PDF-Printer, in meinem Fall Bullzip PDF Printer) klappt, zumindest bis zur Seite 4 (längere Rechnungen hab ich noch nicht erzeugt ^^), aber der direkte Druck erzeugt eine Verschiebung des Hintergrundes von Seite zu Seite um etwa 1 cm ... wahrscheinlich ein Druckerrand, den Firefox beim Druck dann berücksichtigt.

Nun meine Frage: Kann ich dafür sorgen, dass das Hintergrundbild auf JEDER Seite des Ausdrucks immer wieder neu angefangen wird? Also egal, wie gross die Seite tatsächlich wird, auf jeder neuen Seite im Ausdruck wird der Hintergrund immer neu oben links positioniert.

Vielen Dank schon mal ...

  1. Hallo und guten Morgen,

    von welchem Element ist denn das Bild Hintergrundbild?

    Grüße
    TS

    1. von welchem Element ist denn das Bild Hintergrundbild?

      Vom Element <body>. Den Seitenumbruch erzeuge ich mittels: <div style="page-break-before:always"></div>

      1. Hallo und guten Tag,

        von welchem Element ist denn das Bild Hintergrundbild?

        Vom Element <body>.
        Den Seitenumbruch erzeuge ich mittels: <div style="page-break-before:always"></div>

        Na dann... :-|

        Body ist im Prizip unendlich! Wenn Du das Hintergrundbild auf jeder Druckseite haben willst, bin e es an das per Seite zur erstellende Element und nicht an den allumfassenden Body.

        Ich beschäftige mich seit ca. 2003 mit dem Druck von Dokumenten aus dem Browser heraus. Vorher haben das Andere für mich getan. Da liegen also teilweise auch noch Berichte vor.

        Am besten konnte das, so verteufelt er immer wird, immer der IE.

        Es hat sich bewährt, die Seiten für den Druck so aufzubauen, dass sie in ein DIN-Format, vornehmlich A4 passen unter Berücksichtung von 2cm Rand ringsherum. Es gibt zwar Seiten, die es schaffen, auch beim Firefox (> V30) den voreingestellten Rand für den Druck zu überschreiben, aber wie die das machen, habe ich noch nicht wirklich herausgefunden - oder noch nicht intensiv genug gesucht. Die offiziellen Methoden scheinen es jedenfalls nicht zu sein.

        Jedenfalls hat es keinen Sinn, Elemente zu bauen, die größer al eine Seite beim Druck sind. Da fangen die Browser an zu kotzen. Du musst also den Content aufteilen in Elemente, die noch in die Seite hineinpassen. Zum Glück kann man das mittels Backend-Scripting heute alles steuern.

        Und zur Not hilft für den Druck die GD-Lib mit http://php.net/manual/de/function.imagettftext.php. Zum Druck kann man ja auch ein Bild (oder mehrere) senden.

        Ich stehe aber auf dem Standpunbkt, dass HTML nicht ausschließlich für den Screen gemacht wurde, sondern speziell durch CSS die Möglichkeiten erhalten hat, medienübergreifend ähnliche und brauchbare Ergebnisse zu liefern.

        Grüße
        TS

        1. Vielen Dank für Deine umfangreiche Antwort. :)

          von welchem Element ist denn das Bild Hintergrundbild?

          Vom Element <body>.
          Den Seitenumbruch erzeuge ich mittels: <div style="page-break-before:always"></div>

          Na dann... :-|

          Body ist im Prizip unendlich! Wenn Du das Hintergrundbild auf jeder Druckseite haben willst, binde es an das per Seite zur erstellende Element und nicht an den allumfassenden Body.

          KlatschAnDieStirn Logisch, da hab ich aber einen fetten Balken vorm Kopp gehabt.

          Es hat sich bewährt, die Seiten für den Druck so aufzubauen, dass sie in ein DIN-Format, vornehmlich A4 passen unter Berücksichtung von 2cm Rand ringsherum.

          Der 'leere' Geschäftsbrief ist bis an den Rand bedruckt. Druckereien können das ... Der Inhalt ist natürlich mit Rand. Ich habe in meinem FF die Druckränder alle auf 0cm gesetzt, so dass ich den Rand selbst steuern kann. So reicht auch der Hintergrund im erzeugten PDF bis an den Blattrand. Ob das die beste Lösung ist weiss ich nicht, aber das Buchhaltungssystem ist ja nicht für die Allgemeinheit gedacht. ;)

          Am Besten mache ich also für jede Seite einen DIV-Container, DIN A4 groß, und bestücke den mit dem Hintergrund. Da kann ich ja den leeren DIV für den erzwungenen Seitenumbruch nehmen ...

          Und zur Not hilft für den Druck die GD-Lib mit http://php.net/manual/de/function.imagettftext.php.

          Hab ich auch schon überlegt, aber da steh ich denke, dass der Browser das Rendern des Textes besser kann, als ich das je hinbekommen würde. Daher wandel ich die HTML-Ausgabe auch nicht selbst in ein PDF um - das könnte PHP ja auch - sondern nutze dafür einen PDF-Printer.

          Ich stehe aber auf dem Standpunbkt, dass HTML nicht ausschließlich für den Screen gemacht wurde, sondern speziell durch CSS die Möglichkeiten erhalten hat, medienübergreifend ähnliche und brauchbare Ergebnisse zu liefern.

          Der Meinung bin ich auch. ;)

          Vielen Dank

          Willi

          1. Hallo und guten Tag,

            Vielen Dank für Deine umfangreiche Antwort. :)

            Ohhh, das war nur 1% vom gesammelten Frust mit den HTML-Fuzzies :-(((((((((((((((((((

            von welchem Element ist denn das Bild Hintergrundbild?

            Vom Element <body>.
            Den Seitenumbruch erzeuge ich mittels: <div style="page-break-before:always"></div>

            Na dann... :-|

            Body ist im Prizip unendlich! Wenn Du das Hintergrundbild auf jeder Druckseite haben willst, binde es an das per Seite zur erstellende Element und nicht an den allumfassenden Body.

            KlatschAnDieStirn Logisch, da hab ich aber einen fetten Balken vorm Kopp gehabt.

            Es hat sich bewährt, die Seiten für den Druck so aufzubauen, dass sie in ein DIN-Format, vornehmlich A4 passen unter Berücksichtung von 2cm Rand ringsherum.

            Der 'leere' Geschäftsbrief ist bis an den Rand bedruckt. Druckereien können das ...

            Browser könnten das auch steuern, wenn man sie lassen würde, also wenn die Browserhersteller nicht alle unterschiedliche Auffassungen von "wer darf was steuern und wann?" hätten. Würde man einen "Drucken, wie die Seite dies anfordert"-Schalter einbauen in die Druckdialoge, dann wäre das Problem sehr schnell erledigt, denn die Konzepte für einen vernunftgesteuerten Druck sind fast alle schon drin in HTML und vor allem CSS!

            Der Inhalt ist natürlich mit Rand. Ich habe in meinem FF die Druckränder alle auf 0cm gesetzt, so dass ich den Rand selbst steuern kann. So reicht auch der Hintergrund im erzeugten PDF bis an den Blattrand. Ob das die beste Lösung ist weiss ich nicht, aber das Buchhaltungssystem ist ja nicht für die Allgemeinheit gedacht. ;)

            Und dann gibt es Browser, die das ernst nehmen und tatsächlich dem Drucker keinen Rand vorschreiben :-O

            Am Besten mache ich also für jede Seite einen DIV-Container, DIN A4 groß, und bestücke den mit dem Hintergrund. Da kann ich ja den leeren DIV für den erzwungenen Seitenumbruch nehmen ...

            Genau, A4 minus Standardrand von 2cm ringsherum macht dann etwa 17cm x 26cm nutzbare Fläche. Manchmal kann man das Hintergrundbild noch verschoben darstellen, also mit negativem margin. Musst Du mal experimentieren. Und die "Page-Box" sollte dann auf "overflow: hidden" stehen.

            Und zur Not hilft für den Druck die GD-Lib mit http://php.net/manual/de/function.imagettftext.php.

            Hab ich auch schon überlegt, aber da steh ich denke, dass der Browser das Rendern des Textes besser kann, als ich das je hinbekommen würde. Daher wandel ich die HTML-Ausgabe auch nicht selbst in ein PDF um - das könnte PHP ja auch - sondern nutze dafür einen PDF-Printer.

            Ich stehe aber auf dem Standpunbkt, dass HTML nicht ausschließlich für den Screen gemacht wurde, sondern speziell durch CSS die Möglichkeiten erhalten hat, medienübergreifend ähnliche und brauchbare Ergebnisse zu liefern.

            Der Meinung bin ich auch. ;)

            Grüße
            TS

            1. Vielen Dank für Deine umfangreiche Antwort. :) Ohhh, das war nur 1% vom gesammelten Frust mit den HTML-Fuzzies :-(((((((((((((((((((

              oO

              Der Inhalt ist natürlich mit Rand. Ich habe in meinem FF die Druckränder alle auf 0cm gesetzt, so dass ich den Rand selbst steuern kann.

              Und dann gibt es Browser, die das ernst nehmen und tatsächlich dem Drucker keinen Rand vorschreiben :-O

              So sollte es aber auch sein. Der FF macht das, so kann ich die Position auf der Seite millimetergenau steuern.

              Allerdings haben viele Drucker auch noch einen Rand, z.b. der von mir verwendete HP OfficeJet 8500. Den kann man latürnich nicht umgehen ...

              Vielen Dank

              Willi

              1. Hallo und guten Tag,

                Der Inhalt ist natürlich mit Rand. Ich habe in meinem FF die Druckränder alle auf 0cm gesetzt, so dass ich den Rand selbst steuern kann.

                Und dann gibt es Browser, die das ernst nehmen und tatsächlich dem Drucker keinen Rand vorschreiben :-O

                So sollte es aber auch sein. Der FF macht das, so kann ich die Position auf der Seite millimetergenau steuern.

                Nee, der hält den vom Local-User eingetellten Rand ein. Da kannst dich auf den Kopf stellen. Ben bis auf die vorbeigehuschten Ausdrucke von Seiten, bei denen ich das noch nicht verififiziern konnmte, wie die das gemacht haben. Diese Ausdrucke kamen durch die Hauspost zu mir.

                Grüße
                TS

                1. So sollte es aber auch sein. Der FF macht das, so kann ich die Position auf der Seite millimetergenau steuern.

                  Nee, der hält den vom Local-User eingetellten Rand ein. Da kannst dich auf den Kopf stellen. Ben bis auf die vorbeigehuschten Ausdrucke von Seiten, bei denen ich das noch nicht verififiziern konnmte, wie die das gemacht haben. Diese Ausdrucke kamen durch die Hauspost zu mir.

                  Ich glaub, da hast Du mich missverstanden. Ich hab ja im FF bereits die Ränder auf 0cm gestellt, dadurch druckt er auch diese nervigen Kopf- und Fusszeilen nicht aus, die er ansonsten immer mit druckt (ich hab jedenfalls noch nicht herausgefunden, wie man das per Javascript/HTML unterbinden kann, wenn das überhaupt geht)

                  Dadurch gehen meine Ausdrucke randlos, bis auf eben jene paar mm, die z.B. die Drucker von HP immer haben. Das meinte ich ...

                  Viele Grüße Willi

                  1. Hallo und guten Tag,

                    So sollte es aber auch sein. Der FF macht das, so kann ich die Position auf der Seite millimetergenau steuern.

                    Nee, der hält den vom Local-User eingetellten Rand ein. Da kannst dich auf den Kopf stellen. Ben bis auf die vorbeigehuschten Ausdrucke von Seiten, bei denen ich das noch nicht verififiziern konnmte, wie die das gemacht haben. Diese Ausdrucke kamen durch die Hauspost zu mir.

                    Ich glaub, da hast Du mich missverstanden. Ich hab ja im FF bereits die Ränder auf 0cm gestellt, dadurch druckt er auch diese nervigen Kopf- und Fusszeilen nicht aus, die er ansonsten immer mit druckt (ich hab jedenfalls noch nicht herausgefunden, wie man das per Javascript/HTML unterbinden kann, wenn das überhaupt geht)

                    Dadurch gehen meine Ausdrucke randlos, bis auf eben jene paar mm, die z.B. die Drucker von HP immer haben. Das meinte ich ...

                    Du kannst es aber nicht in der Webseite steuern, sondern musst deine User bitten, das in ihrem Browser-Druckdialog temporär so einzustellen. Und das können erstmal nur 5%, wollen dann auch nur 20% der bisher unbedarften und die restlichen 75% beklaen sich (innerlich) über die Unbrauchbarkeit deiner Rechnungen.

                    Grüße
                    TS

                    1. Ich glaub, da hast Du mich missverstanden. Ich hab ja im FF bereits die Ränder auf 0cm gestellt, dadurch druckt er auch diese nervigen Kopf- und Fusszeilen nicht aus, die er ansonsten immer mit druckt (ich hab jedenfalls noch nicht herausgefunden, wie man das per Javascript/HTML unterbinden kann, wenn das überhaupt geht)

                      Dadurch gehen meine Ausdrucke randlos, bis auf eben jene paar mm, die z.B. die Drucker von HP immer haben. Das meinte ich ...

                      Du kannst es aber nicht in der Webseite steuern, sondern musst deine User bitten, das in ihrem Browser-Druckdialog temporär so einzustellen. Und das können erstmal nur 5%, wollen dann auch nur 20% der bisher unbedarften und die restlichen 75% beklaen sich (innerlich) über die Unbrauchbarkeit deiner Rechnungen.

                      Wie ich schon schrieb, ist das System nur für mich. Rechnungen bekommt der Kunde als PDF per eMail oder Ausgedruckt per Post. Bei einem Kundensystem würde ich generell alle Ausdrucke nur als PDF erzeugen und dann über einen Link zum Ausdrucken/Speichern/Versenden anbieten. Nur wenn der Anwenderkreis beim Kunden sehr überschaubar ist, kann man das als HTML-Dokument vorbereiten und lokal ausdrucken lassen. Dann bleibt der Schulungsaufwand überschaubar ...

                      Bis denne Willi

                      1. Hallo und guten Tag,

                        Du kannst es aber nicht in der Webseite steuern, sondern musst deine User bitten, das in ihrem Browser-Druckdialog temporär so einzustellen. Und das können erstmal nur 5%, wollen dann auch nur 20% der bisher unbedarften und die restlichen 75% beklaen sich (innerlich) über die Unbrauchbarkeit deiner Rechnungen.

                        Wie ich schon schrieb, ist das System nur für mich.

                        warum die Einschränkung, wenn es auch ohne ginge?

                        Grüße
                        TS

                        1. Wie ich schon schrieb, ist das System nur für mich.

                          warum die Einschränkung, wenn es auch ohne ginge?

                          Wie meinst Du das? Ich habe eigentlich einen Rand von 2 cm zu allen Seiten. Wenn ich auf Rechnungspapier drucke, hab ich kein Problem. Wenn ich ein PDF erzeuge, hab ich derzeit nur auf der ersten Seite das 'Rechnungspapier', der Rest ist ohne Hintergrund, aber das haben wir ja schon geklärt :)

                          Ich erzeuge beide Dokumente, indem ich eine passende HTML-Ausgabe im Browser erzeuge. Die Ränder hab ich in den Druckeinstellungen im Browser auf 0 cm gesetzt, damit der Browser keine Kopf- und Fusszeilen druckt, was hervorragend funzt. Bei der PDF-Ausgabe wird einfach mein SVG-Hintergrundbild mit angezeigt, das ich mir aus meinem Rechnugspapier angefertigt habe, und der Rand ein bisschen angepasst und das so erzeugte Dokument auf einen PDF-Printer geschoben.

                          Das einzige Problem was ich habe, ist, wenn ich das PDF-Dokument direkt aus dem Browser auf den Drucker schicken möchte. Da der Hintergrund genau A4 groß ist, bekomme ich wegen der unvermeidlichen Druckränder meines HP-Druckers unschöne Verschiebungen auf den folgenden Seiten des Drucks. Also eigentlich dann, wenn ich etwas machen möchte, was ich nicht vorgesehen habe :)

                          Was kann ich besser machen?

                          Bis denn Willi