Voici un lien qui renvoie sur une page contenant deux textes identiques entourant une photo.
 
http://cyberillac.com/textecadre.html
 
Je voudrais sur le bloc du bas reproduire le bloc du haut de telle sorte que le texte encadre l'image.
Comment faire sachant qu'une des contraintes serait de ne pas avoir à découper le texte ligne à ligne manuellement pour lui garder sa cohérence de part et d'autre de la photo ?
Existe-t-il un moyen HTML, CSS, PHP, JAVASCRIPT pour réaliser cela ?
Merci pour vos suggestions.
 
 
 

Je ne crois pas que ce soit possible, le seul moyen serait de le faire en Javascript/css qui découperait le texte ligne par ligne mais automatiquement. Et cela me semble bien compliqué.

Merci, MaybeEijOrNot pour cette réponse honnête.
Je me doutais bien que l'affaire n'était pas simple.  
Cependant, l'idée du javascript/css me séduit. Un commencement de développement me serait bien utile pour démarrer une réflexion susceptible d'aboutir.
Merci encore.

Bonjour MaybeEijOrNot,
Votre réponse m'a donné l'idée de tenter le codage de cette mise en page en PHP. Après bien des hésitations et beaucoup de déboires, j'ai réussi à pondre cette page qui répond à ma question initiale.
Le texte encadre automatiquement la photo sans qu'il soit besoin de reconstruire les coupures dans le texte à la main.  
 
http://cyberillac.com/toureiffel.php
 
Si cela vous intéresse je vous donne accès au fichier PHP sur ce lien.
 
https://www.dropbox.com/s/w23epvclw [...] l.php?dl=0
 
Merci de votre aide.
 

Bonjour,
 
J'ai oublié de répondre. Mais pour la solution JS/CSS je pensais au CSS pour gérer la taille des cadres et éventuellement découper les mots, puis au JS pour vérifier via les propriétés CSS la taille qu'occupe réellement les chaînes de caractères pour les découper en sous-chaînes à placer dans les bons blocs.
 
Avec un schéma HTML :
1 bloc d'une ligne complète (supérieur)
1 bloc à gauche de l'image, 1 bloc au milieu avec l'image, 1 bloc à droite de l'image
1 bloc d'une ligne complète (inférieur)

Bonjour,
 
Idée à creuser mais effectivement source d'une belle prise de tête !
Je reste sur ma solution à base de php.
Même si elle n'est pas parfaite et si elle mérite des compléments d'essai avec des textes plus longs ou plus courts et des variantes de positions relatives photo/texte, je la garde sous le coude pour une exploitation future.
Merci de votre participation à la résolution de cet intéressant problème de mise en page.  

La solution proposée pourrait poser des soucis dans le cas d'écrans pas très larges. Le bloc de texte de droite pourrait passer à la ligne. Ca peut être compliqué à gérer en responsive design

Exact Rufo, je n'avais pas pensé à faire un essai en réduisant la largeur de l'écran.
Bien vu.
Il me reste " sur le métier à remettre mon ouvrage "

Bonjour Rufo,
Je crois avoir résolu le problème d'affichage sur écran étroit en encapsulant toute la page avec un CSS définissant un bloc de largeur 1000px.
 
http://cyberillac.com/toureiffel.php
 
Le fichier PHP est ici :
https://www.dropbox.com/s/h7voqcve6 [...] l.php?dl=0
 
Merci de me dire ce que vous en pensez.

Ben si la résolution fait moins de 1000px de large, tu l'as dans l'os

Certes, difficile de faire apparaître en entier un texte de 1000 px sur un écran de 500px de large. !
Dans ce cas on peut toujours l'explorer en utilisant l'ascenseur latéral tandis qu'avant l'encapsulation de la page il y avait des sauts de lignes qui désorganisaient l'affichage. Maintenant, l'effet d'encadrement de la photo par le texte reste stable, même si on ne voit pas tout...
Je n'ai pas la prétention avec ce truc de concevoir en "responsive design".
Merci en tout cas d'avoir répondu à mes questions.