Ich habe eine funktionierende @media print
Abfrage in modal
. Dann fügte ich ein Diagramm hinzu, das auch eine PRINT-Funktionalität hat. Wenn ich den Ausdruck in der Grafik ausprobierte, wird in Chrome Print Dialog nichts angezeigt. Ich denke das wegen der @media print
. Wie kann ich die gleiche Funktionalität von modal
in meinem chart
hinzufügen?CSS Media Print Query
CSS Media Print:
@media print {
@page {
size: auto;
margin: 3mm;
margin-right: 57mm;
margin-left: 57mm
}
body * {
visibility: hidden;
}
#admissionSlip * {
visibility: visible;
overflow: visible;
}
#chart * {
visibility: visible;
overflow: visible;
}
#mainPage * {
display: none;
}
#printBtn {
display: none;
}
.modal {
position: absolute;
left: 0;
top: 0;
margin: 0;
padding: 0;
min-height: 550px;
visibility: visible;
/**Remove scrollbar for printing.**/
overflow: visible !important;
}
.modal-dialog {
visibility: visible !important;
/**Remove scrollbar for printing.**/
overflow: visible !important;
}
li {
page-break-after: auto;
}
/* Chart */
.panel {
visibility: visible !important;
/**Remove scrollbar for printing.**/
overflow: visible !important;
}
}
Wie wäre es, wenn Sie 'body * {visibility: hidden;}' entfernen? –
@KenjiMukai, es funktioniert auf Diagramm, aber als ich versuchte, den Druck in meinem modalen Teil zu klicken, wurde das Display unordentlich. – Marksmanship