Report any technical problems you discover and discuss solutions.

Print page in a bootstrap

Plus d'informations
il y a 3 ans 10 mois #8358 par Martens
Print page in a bootstrap a été créé par 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;
}
}

Connexion ou Créer un compte pour participer à la conversation.

Modérateurs: ronmjultenJohnSmith
Temps de génération de la page : 0.137 secondes
Copyright © 2026 The Xerte Project.
Xerte logo Apereo logo OSI Logo