fix(print): set height:210mm on block wrapper, not flex container
Build pitch-deck / build-push-deploy (push) Successful in 1m39s
CI / go-lint (push) Has been skipped
CI / python-lint (push) Has been skipped
CI / nodejs-lint (push) Has been skipped
CI / test-go-consent (push) Successful in 32s
CI / test-python-voice (push) Successful in 30s
CI / test-bqas (push) Successful in 29s

Firefox doesn't honor height on flex containers in print mode — the
container collapses to content height, causing all slides to fit on 2
pages. Moved the authoritative height to the display:block wrapper
(.print-page-break) and changed .print-page to height:100% so it
fills its reliably-sized block parent.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Sharang Parnerkar
2026-05-12 18:59:47 +02:00
parent 583e54fabc
commit 49e594bf38
+21 -23
View File
@@ -1,4 +1,4 @@
/* Named page rule — must be outside @media print */ /* Named page — must be outside @media print */
@page slide-page { @page slide-page {
size: A4 landscape; size: A4 landscape;
margin: 0; margin: 0;
@@ -38,35 +38,33 @@
} }
/* /*
* Block wrapper owns the page break. * Block wrapper: carries the height AND the page break.
* - `page: slide-page` assigns each wrapper its own named page type, * Firefox honors height:210mm on display:block reliably in print;
* which forces Firefox/Chrome to start a new physical page per element. * it does NOT reliably honor it on flex containers.
* - break-before/page-break-before are belt-and-suspenders for older engines.
* - We use break-before (not break-after) to avoid a blank trailing page.
*/ */
.print-page-break + .print-page-break { .print-page-break {
page: slide-page; page: slide-page;
display: block !important; display: block !important;
break-before: page !important;
page-break-before: always !important;
margin: 0 !important;
padding: 0 !important;
}
.print-page-break:first-child {
page: slide-page;
display: block !important;
margin: 0 !important;
padding: 0 !important;
}
/* Flex layout inside each slide — no break properties here */
.print-page {
width: 297mm !important; width: 297mm !important;
height: 210mm !important; height: 210mm !important;
margin: 0 !important;
padding: 0 !important;
overflow: hidden !important;
}
/* Force new page before every slide except the first */
.print-page-break + .print-page-break {
break-before: page !important;
page-break-before: always !important;
}
/* Inner flex container fills the block wrapper */
.print-page {
display: flex !important; display: flex !important;
flex-direction: column !important; flex-direction: column !important;
overflow: visible !important; width: 100% !important;
height: 100% !important;
overflow: hidden !important;
margin: 0 !important; margin: 0 !important;
box-shadow: none !important; box-shadow: none !important;
} }