Gérer les problèmes d'affichage avec les colonnes


Il arrive parfois que sur une page possédant plusieurs colonnes, des problèmes d'affichage surviennent et ce surtout si des images sont présentes dans une des colonnes.
image Capture_decran_20130902_a_101434.png (0.6MB)

L'image déborde alors sur le texte de gauche ou de droite et empêche sa lecture.
Ceci est dû à une petite erreur de mise à l'échelle de l'image par Yeswiki. Cette erreur devrait être résolue avec la prochaine version de Yeswiki (???)

Pour résoudre ce problème en attendant :

Il faut aller donner soi-même la bonne taille de largeur de colonne à l'image insérée.

Par défaut le code de l'image insérée devrait ressembler à ça
{{attach file="criemouscron.png" desc="image criemouscron.png (15.1kB)" size="original" class="left original"}}

il faudrait remplacer le "size="original" par width="un nombre de pixel"
{{attach file="criemouscron.png" desc="image criemouscron.png (15.1kB)" width="540" class="left original"}}

Le nombre de pixel dépend évidemment de la largeur de la colonne dans lequel vous avez insérée l'image.
Cette largeur indiquée en span se traduit par un nombre de pixels
  • span1 70px,
  • span2 170px,
  • span3 270px,
  • span4 370px,
  • span5 470px,
  • span6 570px,
  • span7 670px,
  • span8 770px,
  • span9 870px,
  • span10 970px,
  • span11 1070px,
  • span12 1170px


Les dimensions indiquées sont liées à la feuille de style tools/templates/themes/yeswiki/styles/bootstrap/bootstrap-responsive.min.css.
L'usage de la feuille de style tools/templates/presentation/styles/bootstrap.min.css implique des largeurs différentes pour les colonnes