Une remarque ? Une suggestion ?...

Merci de participer à l'amélioration de ce site. Prenez le temps de rédiger votre remarque le plus précisément possible :

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.