Seitenumbruch bei bestimmtem Maß einer CSS-Box?

[michael2105]

Hallo zusammen,

ich erstelle gerade einige Templates für eine Dispositionssoftware die wir für unsere Firma angeschafft haben. Diese gibt von den eingetragenen Buchungen auch die Rechnungen aus. Die Rechnungen werden aus der Anwendung mit javascript in html-Templates geschrieben.

Jetzt stehe ich vor dem Problem, dass eine Buchung z.B. 20 oder 30 Tage Tage umfasst - das ergibt dann 20 oder 30 einzelne Positionen unterschiedlichen Umfangs und die passen natürlich nicht auf eine DIN-A4 Seite. Also muss ein Seitenumbruch nach x Buchungen her - dachte ich mir...

Wenn jetzt aber die Seite gedruckt wird steht z.B. die Überschrift der einelnen Position auf Seite1 und der Rest der Position auf Seite 2. Anders gesagt - mir bricht die Seite mitten in der Buchungsposition um. Das sieht natürlich nicht sonderlich schön aus.

Nun kam mir die Idee, einen Container mit CSS zu erstellen der die einzelnen Positionen beinhaltet. Dieser darf nicht höher als z.B. 25 cm werden. Ist die Höhe erreicht, soll ein Seitenumbruch geschrieben werden.


Ok - ich gebe zu es klingt etwas kompliziert - darum hier noch ein Beispiel anderer Art:

Stellt Euch vor Ihr habt ein Gästebuch mit 20 oder 30 Einträgen - oder anders gesagt: Ein Array mit unterschiedlich vielen Daten ergießt sich in eine div-Box ^^
Diese div-Box soll nun nicht nach 5 Einträgen/Seite geschlossen werden, sondern wenn die Höhe 25cm erreicht hat. 25cm können 5, oder 10 Einträge beinhalten - je nachdem wieviele Zeichen in dem Eintrag stehen würden.


Ich hoffe es klingt einigermaßen nachvollziehbar.
Leider gibts auch keine andere Möglichkeit an die Daten heranzukommen. Die Ausgabe mit javascript in html-Templates ist fest in die Applikation programmiert.


Danke im voraus für Eure Hilfe
Gruß
Michael

 

[crash]

Du suchst page-break-* und wirst maßlos enttäuscht sein.

 

[michael2105]

Wie ich den Seitenumbruch setze wusste ich bereits.

Mir gehts darum diesen Seitenumbruch nach genau 25cm der css-Box zu setzen, dies allerdings während das array mit einzelnen Daten in die css-Box geschrieben wird ;)

Die Ausgabe soll dann unterbrochen werden und nach dem Seitenumbruch wieder aufgenommen werden.

Trotzdem Danke für deine Hilfe
Gruß
Michael

 

[Junny]

Hallo Michael,

vielleicht würde es helfen, wenn Du ein paar Details zu den Buchungen erläuterst. Was steht da alles drin?

Wie ich Dich verstanden habe, sind die Buchungen alle deutlich kleiner als eine Seite, sodass je mindestens drei raufpassen. Wenn das zutrifft, zeichne Deinen Inhalt geeignet aus (für meinen Eindruck ist es eine ungeordnete Liste mit Buchungen als Einträgen) und teile dem Browser per CSS mit, dass Umbrüche in Buchungen vermieden werden sollten. Ich habe es selber noch nie so gemacht, aber wenn die Browser diese Standards richtig interpretieren, sieht das inetwa so aus:

<h1>Buchungen</h1>
<ul id="buchungen">
  <li>
    <h2>Peter Pan</h2>
    <p>Der Kinderheld ist f&uuml;r mehrere Tage gebucht.</p>
  </li>
  <li>
    <h2>Bibi Blocksberg</h2>
    <p>Die Hexe erfreut sich steigender Beliebtheit und ist das ganze Jahr ausgebucht.</p>
  </li>
</ul><

ul#buchungen li {
  page-break-inside: avoid; /* ungetestet und noch nie verwendet, aber theoretisch geht es so */
}

 

[michael2105]

In den Buchungen steht so einiges drin - leider.

Der Quellcode des html-Templates ist 1800 Zeilen lang. Insgesamt werden aus der Software 130 Arrays in das Template geschoben. Jedes dieser Arrays ist in Abhängigkeit von den Benutzerrechten gefüllt, die dem User innerhalb der Software zur Verfügung stehen. Sonst könnte ja jeder Benutzer sämtliche Buchungsdetails über das html-Template einsehen.

Das Problem ist, dass das Template gleichzeitig für unterschiedliche Zwecke benutzt wird. Einerseits erstellt es die Rechnung die dem Kunden später zugeschickt wird, andererseits erstellt es auch die Zeitberichte unserer Angestellten. Daher spiele ich bereits mit dem Gedanken den ganzen Kram zu splitten und mehrere Templates für verschiedene Zwecke zu erstellen. Schließlich sind Templates ja auch eigentlich dazu gemacht entweder das eine oder das andere in korrekter Form anzuzeigen. Der Typ der dieses Template damals erstellt hat, hat da wohl was missverstanden ;ugl

Naja - ich setze mich heute Abend mal dran und bastele ein bisschen rum - vielleicht funktionierts ja bereits mit der oben angesprochenen Lösung.

Viele Grüße
Michael