Report any technical problems you discover and discuss solutions.

Print page in a bootstrap

  • Martens
  • Onderwerp Auteur
  • Offline
  • Nieuw lid
  • Nieuw lid
Meer
3 jaren 10 maanden geleden #8358 door Martens
Print page in a bootstrap werd gestart door Martens
Who can help to improve my print code?

I would like to have a nice print of a bootstrap page. So I've created a printbutton and some style-code. But the code I created is not yet good enough. My wishes are:

- Every section always on a new page. Except for the first page (I don't want empty pages)
- Don't print video
- Headers/titles (H1, H2, H3) should always be followed by text (p). So there never will be a title at the bottom of the printed page
- I would like to change the margin at the end of the page. But without half lines at the bottom of the printed page (which happens now)


/* print.css */

/* target all pages */
@page {
margin: 1cm;
}

/* target the first page only */
@page :first {
margin-top: 0cm;
}

/* print.css */
.accordion, p {
page-break-inside: avoid !important;
}

section {
page-break-before: always !important;
}

@media print {
.footer,
#non-printable {
display: none !important;
}
#printable {
display: block;
}
}


@media print {
.mejs-mediaelement, .vidHolder,
#non-printable {
display: none !important;
}
#printable {
display: block;
}
}

Graag Inloggen of een account aanmaken deelnemen aan het gesprek.

Moderators: ronmjultenJohnSmith
Tijd voor maken pagina: 0.123 seconden
Copyright © 2026 The Xerte Project.
Xerte logo Apereo logo OSI Logo