Image hors du texte mais quand même centrée.Résolu/Fermé

Question

Bonjour, 

c'est un peu particulier, voilà :

j'ai une variable $texte (qui affiche un long texte) et une variable $image (de type "./image/img001.jpg").

Je voudrais savoir s'il est possible d'afficher $image où je veux, à l'intérieur du texte, et que le texte comprenne et ne chevauche pas l'image.

Du genre

___________
|------ __------|
|------|jpg|----|
|------|jpg|----|
|----------------|
|_-_-_-_-_-_-|

Si vous voyez ce que je veux dire (je suis nul en dessin, désolé). Bref, mettre une image en plein milieu d'un texte, de sucroît quand l'image n'est pas implanté dans $texte.

J'ai pensé à découper le texte mais celui-ci est dynamique.
L'image, elle, ne changerai pas en dimensions (à priori).

Quelques éléments de non-réponse :
- mettre l'image en background ne règle pas l'histoire du chevauchement, ou alors il faut définir une zone de "non-texte" dans le texte mais je ne vois pas... ;
- j'ai essayé pas mal de combinaisons avec les position relative/absolute, les display inline, inline-block sans succès mais peut-être que ce n'est qu'une histoire de css...

Qu'en pensez-vous ?

Possible ou pas ?


Configuration: Windows 7 / Firefox 3.6.12

jalalnet · Answer

je pense pas que c'est impossible tant que le texte dynamique

aliosh4 · Answer

Tant que le texte dynamique... ?

arthezius · Answer

J'ai réussi à la faire mais avec l'image sur le côté et non centré. Autrement dit: _________________ |------ __------| |jpg|-----------| |jpg|-----------| |---------------| |_-_-_-_-_-_-_-_| Voici le code que j'ai testé:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi pulvinar orci eros. Curabitur consectetur risus at nulla fermentum vitae vestibulum quam euismod. Donec tristique vestibulum massa, at varius enim lacinia quis. Aliquam eget arcu leo, at pretium justo. Vestibulum id arcu nisl, ac aliquam erat. Nunc consectetur turpis eu leo malesuada sodales. Nam mauris est, sodales eu bibendum eu, condimentum vel nisl. Vestibulum et nisi magna. Cras rutrum porttitor fringilla. Mauris accumsan consectetur egestas. Aenean sit amet vestibulum velit. Duis in magna nisl. Fusce vitae congue nibh. Fusce placerat purus in ante iaculis congue vitae eget nisl. Maecenas quis orci massa. Quisque quis volutpat tortor. Duis eu sagittis sem. Vestibulum accumsan iaculis accumsan. Aenean euismod massa risus. Integer id tellus sed urna sodales tempus in ac ligula. Donec non aliquet justo. Donec cursus est elementum nisl pharetra facilisis. Morbi eget risus et lorem lacinia vehicula id sit amet lectus. Nulla urna velit, accumsan at ornare eget, varius nec nisi. In tincidunt neque vitae augue fermentum condimentum. Nunc tellus risus, pharetra sit amet sollicitudin quis, facilisis et metus. Cras ac lectus neque. Ut id leo leo, id rhoncus leo. Praesent convallis imperdiet luctus. Sed imperdiet interdum tellus, eu cursus leo suscipit non. Mauris sit amet metus ut diam sollicitudin suscipit. Nulla volutpat, enim a hendrerit dapibus, tortor elit porttitor justo, vitae egestas diam elit eu nibh. Integer vel nulla eget nibh porta condimentum ac accumsan metus.

Voir ici: http://tests.arthezius.fr/img_float.php

Image hors du texte mais quand même centrée.

3 réponses

Discussions similaires

Newsletters