Skip to main content Help Control Panel

 

Projets «   Campagnes de tests «   RC5 livrée - test de yacs 10.2.12, alias yacs Martin RC 5 «  

images flottante à côté d'un titre [Patched]

Yacs empeche les images flottante de cotoyer les titres

WorkflowSupport request
StatusSolution is available separately
OwnerAlexis Raimbault
Progress100%

Sur un Yacs 10.2.12, je constate un phénomène étrange

Dans les descriptions de mes sections, j'ai des insertions d'image "en html" (je n'utilise par [image=...] car je souhaite que les images des pages restent visibles pour le rédacteur dans l'éditeur Wysiwyg et qu'ils puissent utiliser uniquement cet éditeur pour ajouter et intégrer des images : ).

j'ai donc des <img align="left" src="... et des <img align="right" src="...

Lorsque l'alignement est demandé "à droite", l'image est correctement placée à droite avec le texte qui l'entoure.

Par contre, lorsque l'alignement est demandé à gauche, l'image est bien à gauche mais pas entourée par le texte si jamais celui-ci comporte un titre (ce dernier démarre systématiquement en dessous )

par exemple, le code :

<img src="/images/25/24106.jpg" align="left"><h3>L'adolescence</h3>
<p>Après 2 ans d'existence, ...

me donne :

alors qu'avant, sur mon site en typo3, j'obtenais :

Je me dis que cela doit être un truc en CSS dans Yacs qui intervient mais je ne trouve ni quoi ni où

Quelqu'un aurait une idée ?

Comments

Jmarc - on Mar. 17 2010
Le problème a été enregistré
Jmarc - on Mar. 17 2010

J'ajoute que dans l'éditeur wysiwyg, l'image apparait correctement insérée avec le titre sur le côté.

Ce qui me fait dire que le html est correct et que c'est le css ajouté par yacs qui me change l'affichage


Alexis Raimbault - on Mar. 17 2010

hellow JM

tu dois avoir un {clear:left;} sur la balise h3 dans ton CSS ! (le tien ou yacs.css)

remplace par {clear:none;}

 




Alexis Raimbault webmaster free-lance
Jmarc - on Mar. 17 2010

Yes ! c'était bien ça, dans yacs.css

Merci Alexis pour ton intervention aussi rapide qu'efficace


Bernard Paques - on Mar. 30 2010

L'autre option, c'est de mettre la balise img à l'intérieur de la balise h3 non ? Si tu modifies directement skins/_reference/yacs.css, tu pourrais avoir des surprises après la prochaine mise à jour de ton serveur ...


Bernard Paques - on Mar. 30 2010

J'ai oublié de mentionner que le clear: left utilisé par yacs est destiné, justement, à aligner proprement les titres même en cas d'images flottantes, qu'elles soient explicites ou implicites (vignettes de grandes images par exemple). Ce n'est pas juste pour t'embêter ...


Bernard Paques - on Mar. 30 2010
Alexis Raimbault est le nouveau propriétaire
Fin de l'analyse
Alain Lesage - on Mar. 31 2010

Note : pas besoin de modifier skins/_reference/yacs.css, on peut tout simplement surcharger la règle de style dans mon_skin.css, non ?

Pour ma part, ce que je fais quand j'ai besoin d'obtenir l'effet recherché par Jmarc sans modifier le style par défaut, c'est de taper à la main, seulement pour cette fois-là, la balise h3 (ou h1, h2, etc.) voulue, en lui ajoutant la règle suivante :

<h3 style="clear:none;">Mon titre</h3>

Je ne me souviens plus pourquoi j'ai renoncé à la pratique suggérée par Bernard d'insérer l'image dans la balise h3. Il devait y avaoir une raison... mais peut-être pas non plus... allez savoir...


Alexis Raimbault - on May 3 2010
La solution est disponible séparément


Alexis Raimbault webmaster free-lance