Il y a des choses bizares dans Mozilla, mais ce ne sont pas celles que tu crois. Ce qui cloche dans Mozilla, c'est qu'à chaque mouvement de souris, la cellule du bas se retrouve décalée un peu plus vers le bas.
Par contre, le fait que la cellule ne prend pas toute la ligne est normal.
Par défaut une ligne de table (<tr>) a la propriété "display" à la valeur "table-row" (cette valeur est inconnue de IE), et non "block". Les cellules (<th>, <td>) ont "display: table-cell", et les tables (<table>) "display: table". (Il y a aussi les groupes de lignes et les colonnes, mais ont va les ignorer)
La norme spécifie qu'un "display: table-cell" doit être contenu directement dans un "display: table-row" qui doit être contenu directement dans un "display: table", et inversement. Si ce n'est pas le cas, des éléments "anonymes" (inexistant dans le document, mais présent en tant que structure d'affichage) sont insérés pour rétablir la structure précédente.
Donc, quand tu lui donnes dynamiquement la valeur "block", Mozilla ajoute automatiquement des éléments "anonymes" pour combler les manques. Comme si tu avais (les éléments anonymes seront présentés avec des {}) :
Code : Tout sélectionner
<table width="100%">
{tr}
{td}
<tr id="infos" style="display: block">
{table}
{tr}
<td>Ligne devant être affiché ou caché.</td>
{/tr}
{/table}
</tr>
{/td}
{/tr}
<tr>
<td>Put your mouse here</td>
</tr>
</table>
Pour résoudre ton problème, il faudrait utiliser la valeur "display: table-row" au lieu de "display: block", mais là, c'est IE qui va te poser des problème.
La meilleur solution qui existe, c'est de laisser l'affichage par défaut pour la <tr id="infos">, et de lui affecter par javascript style.display='none' au chargement et quand tu veux le cacher. Pour le l'afficher de nouveau par javascript, tu utilises style.display='', et le <tr> reprendra la valeur d'affichage par défaut.