Exemple de code de la propriété CSS column-span.

<style>
/* Affichage */
.groupe {
 border : 1px solid #666; 
 margin:5px; 
 padding:5px; 
 text-align:justify; 
}
.defaut {
   border : 1px dotted #666; 
}
.groupe p{
 margin:0; padding:0; 
}
.column-gap p{
 margin:0; 
 padding:0; 
 background :#d5f7d5; 
}

.column-gap{
 column-width : auto; 
 column-count : 3; 
}

.column-span-all{
 column-span : all; 
}

</style>
<div class="groupe column-gap">
<h3>Titre</h3>
<p class="defaut ">Cum haec taliaque sollicitas eius aures everberarent expositas semper eius modi rumoribus et patentes, varia animo tum miscente consilia, tandem id ut optimum factu elegit.Cum haec taliaque sollicitas eius aures everberarent expositas semper eius modi rumoribus et patentes, varia animo tum miscente consilia, tandem id ut optimum factu elegit.</p>
<p class="defaut ">Cum haec taliaque sollicitas eius aures everberarent expositas semper eius modi rumoribus et patentes, varia animo tum miscente consilia, tandem id ut optimum factu elegit.</p>
<p class="defaut ">Cum haec taliaque sollicitas eius aures everberarent expositas semper eius modi rumoribus et patentes, varia animo tum miscente consilia, tandem id ut optimum factu elegit.</p>
<h3 class="column-span-all">Titre</h3>
<p class="defaut ">Cum haec taliaque sollicitas eius aures everberarent expositas semper eius modi rumoribus et patentes, varia animo tum miscente consilia, tandem id ut optimum factu elegit.Cum haec taliaque sollicitas eius aures everberarent expositas semper eius modi rumoribus et patentes, varia animo tum miscente consilia, tandem id ut optimum factu elegit.</p>
<p class="defaut ">Cum haec taliaque sollicitas eius aures everberarent expositas semper eius modi rumoribus et patentes, varia animo tum miscente consilia, tandem id ut optimum factu elegit.</p>
<p class="defaut ">Cum haec taliaque sollicitas eius aures everberarent expositas semper eius modi rumoribus et patentes, varia animo tum miscente consilia, tandem id ut optimum factu elegit.</p>
</div>