Est-il possible d'activer la césure automatique en HTML/CSS ?

Question

Mon client a demandé d'activer la césure automatique sur cette page : http://carlosdinizart.com/biography/ , et j'ai réalisé que je ne l'avais jamais vu faire sur une page Web.

Est-il possible de configurer la césure automatique dans un document HTML avec uniquement HTML/CSS ? Si non, quelles sont les options ?

Answer 1

Une option consiste à insérer des traits d'union dans le texte aux endroits où il peut être rompu. Le trait d'union conditionnel est représenté par l'entité ­ en HTML. Vous pouvez trouver des bibliothèques/outils qui peuvent préparer du texte automatiquement avec ­ s aux bons endroits, sinon vous devrez le faire manuellement.

Answer 2

À l'heure actuelle, mon css pour <p> est

 p   {
    font-style: normal;
    padding: 0;
    margin-top: 0;
    margin-left: 0px ;
    margin-right: .5em ;
    margin-bottom: 0;
    text-indent: 1em;
    text-align: justify;
    -webkit-hyphens: auto;
    -moz-hyphens: auto;
    -ms-hyphens: auto;
    -o-hyphens: auto;
    word-break:break-word;
    hyphens: auto;
}

Cela ne fonctionne pas pour Chrome 39 sur Mac. Connu pour ne pas fonctionner sur Opera. Fonctionne pour Firefox, iOS Safari.

Ce n'est PAS infaillible : les colonnes étroites (moins de 6 mots) sont laides, mais dans l'ensemble, la mise en page ressemble beaucoup plus à un type correctement défini.