Astuces CSS : du texte dans une forme
Afficher du texte dans une forme.
La première solution qui pourrait venir à l'esprit est d'utiliser la propriété
clip-path mais le résultat ne sera pas celui escompté.
En effet le texte ne sera pas réajusté dans la forme définie par clip-path
et il sera donc affiché en partie seulement.
La propriété clip-path de cet élément a été définie par un polygone.
Le texte est manifestement incomplet.
La bonne solution consiste à encadrer le texte par deux éléments flottants, un
sur la droite et l'autre sur la gauche.
En définissant la propriété shape-outside de ces deux blocs on obtiendra
le résultat souhaité.
Ce texte semble écrit dans un losange.
En fait il est contraint par un élément flottant à droite et un autre à gauche.
Les propriétés
shape-outside de ces deux éléments flottants ont été
judicieusement définies pour former un losange entre eux.