28106 sujets

CSS et mise en forme, CSS3

Hello,

Je souhaite générer un pdf mais je voudrais que la césure des pages ne coupe pas certains éléments :

J'ai une section avec un loop générant des cards dedans dans ce style

<section>
  <!--début du loop-->
  <div class="card">
    Ma card
  </div>
  <!--fin du loop-->
</section>


J'ai regardé la doc mdn, pour insérer un break, mais j'avoue que j'ai un peu de mal à comprendre entre break-before, inside ou after lequel je dois utiliser. Je voudrais qu'il y ait une césure de page avant ou après une card (mais pas dedans).

Comment faire. Merci pour vos conseils
Modifié par Ben12 (07 May 2022 - 12:59)
Modérateur
Bonjour,

j'opterais pour un
break-inside:avoid;


Logiquement cela devrais faire passer l’élément sur la page suivante au lieu de le couper.
A voir une fois le PDF généré si il y en as encore une trace Smiley smile

Cdt
C'est que j'avais mis sur la class card... mais sans succès. Je me demande si ça ne vient pas de la section ?