html seitenumbruch verhindern

Question

Heidiho MeisterInnen!

ich stehe gerade vor einem kniffligen problem:
dem vernünftigen drucken von div-elementen.

zuerstmal der code

in einer schleife(php) werden alle elemente der reihe nach ausgegeben:

echo "<div class=test>";
printQuestion($ID);
echo "</div><br>";

die css dazu:
div.test
{
border: 3px solid #6D6E72;
height:auto;
page-break-inside:avoid;
display:block;
}

innerhalb der funktion schauts in etwa so aus:
überschrift
<div>
<tabelle mit den auszugebenden werten></table>
</div>


mein ziel wäre jetzt, immer nur genausoviele elemente pro seite zu drucken wie gerade platz haben.
d.h. ein seitenumbruch innerhalb eines elements zu verhindern.

im schnitt passen zwischen 2 und 4 elemtente auf eine seite, ich kann ausschließen daß einzelne größer sind als eine ganze seite.


ich such schon ne halbe ewigkeit und werde nicht schlau, eventuell hab ich hier glück :=)

danke im voraus!

Answer 1

Pech gehabt. page-break-inside wird derzeit ausschließlich von Opera unterstützt. Siehe de.selfhtml.org/css/eigenschaften/printlayouts.htm#page_break_inside.

Du kannst kompromisshalber höchstens die ähnlichen Kandidaten benutzen: page-break-before und page-break-after. Nur erzwingen die einen Umbruch, statt auf die passende Stelle zu warten.

Im übrigen wird "Seitenumbruch" auf ewig ein Problem bleiben, denn du weißt nie, welche Seitenrandeinstellungen der Nutzer hat und ob er im Hoch- oder Querformat druckt. Falls du aber von einem bestimmten Szenario ausgehen kannst (immer Hochformat), dann erstell doch einfach DIVs mit einer festen Höhe und erzwing immer einen Seitenumbruch:

<div style="height: 20cm; page-break-after: always;">mein Text</div>

Answer 2

hmm.

;-(

dann muss ich mir was überlegen!

danke sehr!

:)

Answer 3

ein lösungsvorschlag, der zumindest in den meisten fällen ein brauchbares ergebnis bringt:

1.) 2 klassen definieren
a) page-break-before:avoid;
page-break-inside:avoid;

b) page-break-before:avoid;
page-break-after:always;

standardmäßig haben alle layer die klasse a)

nach aufbau der seite eine funktion aufrufen (body onload=...), in der alle layer der reihe nach durchgegangen werden und die höhe des jeweiligen layers ermittelt wird.

sumHeight+=document.getElementById('layer_'+i).offsetHeight

wenn die summe der Höhen einen gewissen wert ereicht hat (z.b. 800) soll das vorhergehende element die klasse mit dem seitenumbruch zugewiesen bekommen


for(i=0;i<100;i++)
{
if(currOpt!=null)
{
sumHeight+=currOpt.offsetHeight;
if(sumHeight>1000)
{
sumHeight=0;
prevOpt=document.getElementById('layer_'+(i-1));
prevOpt.className="PrintBreak";

}
}

}

is nicht allzu schön, aber für mein problemchen reichs :)