salut,
voici ce que j'aimerai obtenir (fait avec the gimp évidemment)
et voici la situation actuelle.
la difficulté réside dans l'image en bas à droite de la boite de texte.
- positionner cette image en bas droite ne pose pas de problème en utilisant le positionnement absolute ou relative, ou tout simplement en mettant l'image après le texte dans le code HTML.
Mais le positionnement sort l'image du flux, et le texte ne la contourne pas(passe dessus ou dessous).
- pour faire que l'image soit englober par le texte, je n'ai trouvé que les float, d'ailleurs cela fonctionne très bien avec mon image en haut à gauche. Mais le float exclue la possibilité de positionnement vertical, et mon image de droite restera désespérément en haut ou en dessous du texte en fonction que l'image est avant ou après le texte dans le code HTML.
le but donc, positionner une image en bas à droite d'un texte de tel façon que ce texte englobe cette image en effectuant un retrait vers la gauche.
--différentes choses auxquelles on pensent et que j'ai essayé:
-un padding-right sur le texte s'appliquerait sur toute la hauteur de la boite de texte(ça n'est pas l'effet recherché).
-mettre l'image en float a la fin du texte via la pseudo class :after revient à mettre une image de type en ligne à la fin du texte.
-mettre l'image en float dans une div positionner en bas ne fonctionne évidemment pas non plus.
-séparer le texte dans deux boite: une pour le haut du texte et une de la hauteur de l'image. Cela fonctionne mais oblige à bricoler dans le contenue et le code html, ce qui n'est pas adapté à un texte variable et mis en ligne par de simples utilisateurs via des formulaire.
merci d'avoir lu jusque là, et pour vos suggestions si vous en avez
bye
Partager