Machen Sie ein div am Ende einer bestimmten Seite beim Drucken

Ich habe eine Tabelle mit variabler Anzahl von Zeilen. Ich möchte diese Tabelle über Browser ausdrucken. Darunter befindet sich ein div, das unten auf der Seite bleiben sollte. Wenn die Tabelle in der ersten Seite enthalten ist, befindet sich das Div am Ende der ersten Seite. Wenn der Tabellenüberlauf auf die zweite Seite, wird das div eine der Unterseite der zweiten Seite und so weiter, ... Mein erster Ansatz war es zu handhaben, wie ich in HTML tun verwendetMachen Sie ein div am Ende einer bestimmten Seite beim Drucken

.footer{ 
    width: 100%; 
     position: absolute; 
     bottom: 0; 
     font-size: 10pt; 
}

Diese funktioniert nicht. Die Fußzeile bleibt auf der ersten Seite. Brauche deine Hilfe, bitte!

EDIT

ich den Tisch und die Fußzeile in einem div Eltern gemacht, so dass sie Schleife. Eine Fußzeile befindet sich immer auf derselben Seite wie das Ende einer Tabelle. Entschuldigung, für meine Ungenauigkeit!

GELÖST [EDITED]

Ich habe es schließlich durch die Fußzeile von einem anderen div umgibt und einige CSS wie folgt vorgehen:

.table{ 
     min-height: 20cm !important;/* Define height for the table in cm or mm (I encountered a problem with px and %) */ 
     display: block; 
     position: relative; 
     width: 100% !important; 
    } 
    .footer{ 
     width: 100%; 
     position: relative; 
     margin-bottom: 0 !important; 
     font-size: 10pt; 
     page-break-inside: avoid !important; 
     page-break-before: auto !important; /* this pushes the footer to the bottom of next page if table overflows to another page */ 
    }

nur Das verbleibende Problem ist, wenn die Tabelle entspricht genau der erste Seite: die Fußzeile wird auf die nächste Seite geschoben, wird aber auf der Oberseite angezeigt :( Vielen Dank für Ihre Antworten Jungs! :)

Quelle

2016-06-09 Knighto05

Versuchen Siezu verwenden 0 zu diesem div.

Es sollte am Ende der gedruckten Seite platziert werden, wenn Sie bottom: 0 setzen;

Quelle

2016-06-09 12:09:11 dolu92

Sie‘ Richtig, aber ich habe vergessen zu erwähnen, dass der Tisch und das Div Looping sind! Wenn ich das div auf fixiere, wird es am Ende des Dokuments nicht auf der gleichen Seite mit dem Ende der Tabelle gehen. – Knighto05

Nein, wenn Sie das div auf fix setzen, wird es am Ende aller Seiten wiederholt. Aber, soweit ich weiß, möchten Sie den Rest der Seite, auf der der Tisch beendet ist, löschen, und dann, am Ende dieser Seite, möchten Sie die Fußzeile setzen? Danach wird die nächste Seite mit einer neuen Tabelle gestartet, die sich über 3 Seiten erstreckt, also haben Sie 3 Seiten weiter die nächste Fußzeile div? Korrigiere mich, wenn ich falsch liege. – dolu92

Ja, du hast es verstanden! Ich versuchte 'Position: fixed;' und es funktionierte wie ein Zauber für die erste Iteration, aber dann erschien die Fußzeile in jeder einzelnen Seite sogar bis zum Ende. Ich weiß nicht warum! – Knighto05

Ich habe meine Fußzeile an die Unterseite des Div gehalten und ihm zu folgen.

Wenn ich richtig verstehe, wollen Sie die Fußzeile am Ende der Tabelle zu sein, hier sind, wie ich es tat:

#footer { 

    background-color: #333; 
    clear:both; 
    bottom: 0; 
    width: 1200px; 
    height: 50px; 
    margin: 0 auto; 
    border-radius:0px 0px 10px 10px; 
}

und der paragraf in der Fußzeile:

#paragraf_1 { 
     display:block; 
    color:white; 
    text-align:bottom-left; 
    padding:14px 16px; 
    text-decoration:none; 
}

Quelle

2016-06-09 12:23:14

Machen Sie ein div am Ende einer bestimmten Seite beim Drucken

Antwort

Verwandte Themen