Dossier : Justification du texte dans les cellules d'un tableau.

Suivant les navigateurs que vous utiliserez, vous aurez un affichage différent des paragraphes dans les cellules d'un tableau.

Opéra 3.50 est le seul navigateur (que je connais actuellement) prenant en charge la justification du texte dans une cellule par  affectation de la propriété "align" dans la balise <TD>. Ce qui nous donne : <TD align=justify>.

Pour IE 4.x et NS 4.06, nous pouvons obtenir un texte justifié en créant un paragraphe dans la cellule : <TD><P align=justify>le texte...</P></TD>.

Cependant, l'utilisation d'un paragraphe, voir même d'une division, ne semble pas être vraiment une solution, car Opéra effectue un saut de ligne avant et après l'affichage du texte dans une cellule comprenant cette définition (paragraphe, division ou autre), quelque soit son alignement.

Ce tableau résume quelques solutions potentiels :

Javascript Style document Style locale Style par sélecteur de classe

légende bien supporté ajoute de contraintes incompatible

4.06 : les <br> et </p> d'un paragraphe justifié sont étendu ; pour résoudre le problème, placé un éspace en fin de ligne.
3.50 : Dans un paragraphe justifié, la fin de ligne contenant un saut avec éffacement de marge (<br clear=...>) est étendue ; pour rédsoudre le problé, précédé ce saut par un saut standart (<br>).

Solution - Javascript :

L'une des premières solutions est d'utilisé un script "javascript" qui insère le code "<p align=justify>" dans la cellule dans le cas ou le navigateur n'est pas Opéra.

Même si cette solution est portable pour un grand nombre de navigateur, son interprétation demande un travaille qui ralenti l'affichage de la page. De plus, l'insertion d'un grande nombre d'appel à cette fonction augment la taille du fichier source.

Solution - Style document :

Nous pouvons aussi utiliser le style CSS pour affecter la propriété de justification de toutes les cellules du document :

Cette solution n'est pas forcément approprié ; les cellules devant afficher un texte centré/droite/gauche seront justifiés.

Solution - Style locale :

Nous pouvons aussi utiliser un style locale pour une cellule :

Cela ne fonctionne pas sous NS, du moins sur la version 4.06.

Solution - Style par sélecteur de classe :

Nous pouvons définir une classe de style que nous appliquons à un objet cellule.

Cette solution semble être la meilleur, car elle minimise le code, en comparaisons avec la solution utilisant le Javascript.

Application sur votre Navigateur :

Ce tableau résume les caractéristiques précédentes ; il s'affichera suivant votre navigateur ; le texte provient de la nouvelle intitulé "La démon".

Le "Style document" affecte toutes les cellules ; pour visualiser son effet, je génére un tableau avec les définitions <td>, <td align=left>, <td align=justify>, <td align=center> et <td align=right> dans un document contenant la définition de style "TD {text-align : justify}".