ordinarthur/cv
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use viewport units in print so pages adapt to actual paper size
All checks were successful
Build & Deploy / build-and-deploy (push) Successful in 13s
Details

Browse Source 
100vh/100vw makes each .page span the full physical page regardless of
whether the user prints to A4 or US Letter, eliminating the white band
on A4 while keeping the footer visible on Letter.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
ordinarthur 2026-05-13 06:11:53 +02:00
parent 14de85c392
commit c560d4a6dd
2 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
Resume-Arthur-barre-fr.html
View File

@ -452,9 +452,11 @@
@page { size: A4; margin: 0; } @page { size: A4; margin: 0; }
@media print { @media print {
body { background: var(--bg); -webkit-print-color-adjust: exact; print-color-adjust: exact; } body { background: var(--bg); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
html, body { width: 100%; height: 100%; }
.page { .page {
width: 210mm; width: 100vw;
height: 297mm; height: 100vh;
padding: 0;
page-break-after: always; page-break-after: always;
break-after: page; break-after: page;
page-break-inside: avoid; page-break-inside: avoid;
@ -463,8 +465,7 @@
overflow: hidden; overflow: hidden;
} }
.page:last-child { page-break-after: auto; break-after: auto; } .page:last-child { page-break-after: auto; break-after: auto; }
.page { padding: 0; } .frame { width: 100%; height: 100%; border: none; }
.frame { height: 297mm; border: none; }
.row, article, .section-header, .topbar, .hero { page-break-inside: avoid; break-inside: avoid; } .row, article, .section-header, .topbar, .hero { page-break-inside: avoid; break-inside: avoid; }
/* Global print compaction — all pages */ /* Global print compaction — all pages */

7
cv-short.html
View File

@ -352,16 +352,17 @@
@page { size: A4; margin: 0; } @page { size: A4; margin: 0; }
@media print { @media print {
body { background: var(--bg); -webkit-print-color-adjust: exact; print-color-adjust: exact; } body { background: var(--bg); -webkit-print-color-adjust: exact; print-color-adjust: exact; }
html, body { width: 100%; height: 100%; }
.page { .page {
width: 100%; width: 100vw;
height: 270mm; /* fits both A4 (297mm) and US Letter (279mm) */ height: 100vh; /* adapts to actual paper size (A4 or US Letter) */
padding: 0; padding: 0;
page-break-after: auto; page-break-after: auto;
break-after: auto; break-after: auto;
margin: 0; margin: 0;
overflow: hidden; overflow: hidden;
} }
.frame { height: 270mm; border: none; overflow: hidden; } .frame { width: 100%; height: 100%; border: none; overflow: hidden; }
/* Tighten content so it fits on US Letter too */ /* Tighten content so it fits on US Letter too */
.hero h1 { font-size: 32pt; } .hero h1 { font-size: 32pt; }