WBCE CMS Forum

WBCE CMS – Way Better Content Editing.

You are not logged in.

#1 28.04.2020 20:45:16

hansklok
Member

CSS-Print: Multiple Seitenränder möglich?

Hallo,

ich habe ein HTML-Dokument, welches sich aus Abschnitten (<section/>) zusammensetzt. Um die Seitenränder Datei für den Ausdruck anzupassen gibt es ja die CSS-Eigenschaft @Page.

@page {
    margin-top: 2cm;
    margin-bottom: 2cm;
    margin-left: 2cm;
    margin-right: 2cm;
}

Gibt es die Möglichkeit für jede <section/> individuelle Seitenränder für den Druck anzugeben? Vielleicht indem man z.B. eigene Styles pro Abschnitt definiert?

Pseudo Code
<section class="Abschnitt1"> (Ränder: 2, 2, 2, 2 cm)
<section class="Abschnitt2"> (Ränder: 1.25, 2, 2, 2.5 cm)

Den Abschnitten füge ich mittels Style-Tag manuelle Seitenumbrüche für den Druck zu:

<section style="page-Break-after: always;"></section>

Last edited by hansklok (28.04.2020 20:47:22)

Offline

#2 28.04.2020 21:51:58

bernd
Developer

Re: CSS-Print: Multiple Seitenränder möglich?

@page kennt ja die Pseudoelemente :first :left :right für erste, linke,rechte Seiten aber das ist wohl auch noch weit von "individuell für jede Section" entfernt  hmm

Was vielleicht gehen könnte - Achtung! jetzt wird's abenteuerlich:
mittel jQuery vor jede Section eine individuelle Styleangabe reinschreiben,
in etwa so (nicht getestet):

$(document).ready(function(){
    $('<style>@page {margin: 2cm 2cm 2cm 2cm;}</style>').insertBefore('.Abschnitt1');
    $('<style>@page {margin: 1.25cm 2cm 2cm 2.5cm;}</style>').insertBefore('.Abschnitt2');
});

Wenn's nur auf einer Seite gebraucht wird einfach in einen Code2 Abschnitt packen sonst halt in den head-Bereich des Templates ...

Edit - nochmal drüber nachgedacht:
warum eigentlich mit @page ... was spricht gegen @media print ?
da kannst du dich doch dann nach belieben austoben ...
Oder übersehe ich da grade was wesentliches?

Last edited by bernd (28.04.2020 22:49:43)


... nein in Europa verwenden wir beim Programmieren nicht € statt $ ...

Offline

Board footer

Powered by FluxBB

up