Espacement vertical indésirable [résolu]

Bonjour à tous,

J'essaye de réaliser une page permettant d'afficher un échiquier et un texte à droite de l'échiquier (voir ici).
L'échiquier est un tableau. Le tableau et le texte latéral sont tous les deux dans des paragraphes en display:table-cell, le tout étant dans un div display:table.
Lorsque j'affiche ma page, il y a un espace vertical au dessus du texte à droite que je n'arrive pas à supprimer. Qu'est ce que je loupe ?
Ma feuille css est ici.

Merci d'avance pour vos éventuelles réponses
Julien
Modifié par julien1756 (26 Jul 2011 - 17:19)

il faut mettre :

vertical-align: top

puisque ta colonne se comporte comme une cellule de tableau (c'est l'avantage).
Je te rappel, au cas ou, que la propriété table-cell ne fonctionne pas sous IE7 (c'est l'incovégnant).

Merci, ça marche .
Mais il y a un truc qui m'échappe.
Si je n'ajoute pas vertical-align:top, la hauteur de l'espace qui m'embête ne dépend pas de la longueur de mon texte de droite. Je me disais que si mon problème venait d'un mauvais alignement vertical, alors en mettant un texte à droite super long, l'espace disparaîtrait … je ne suis pas très clair.
Merci en tout cas.
Et pas grave pour IE7, c'est pour usage personnel.
Modifié par julien1756 (26 Jul 2011 - 17:10)

Si, la hauteur de l'espace qui t'embête dépend de la longueur de ton texte de droite.
Le texte est centré verticalement dans ta div qui a une hauteur a peu près identique a ton échiquier.

Je suis sous Firefox 5 et j'ai essayé avec des hauteurs différentes, et quand je mets un texte très long, il y a un espace en haut et pas en bas