Question probablement bête sur positionnement CSS

Bonjour à tous,

J'essaie, dans une cellule de tableau de 150 x 150 pixels, de mettre une image de la même taille, puis un texte parfaitement centré au-dessus de cette image. Et je n'y arrive pas ! Il y a toujours une ligne blanche sous mon image ! Démonstration. Je suis sûr que la solution en CSS à ce problème est triviale, mais je ne la trouve pas...

(Par ailleurs, je sais que le problème serait contourné en mettant l'image en arrière-plan (background-image) de la cellule de tableau elle-même, mais, pour des raisons diverses, je ne souhaite pas procéder ainsi...)

Merci d'avance pour toute aide !
Modifié par JYF (11 Dec 2010 - 17:00)

Bonsoir,

La "place" blanche sous ton image est réservée en théorie pour ton texte.
Mais étant donné que tu sors celui-ci du flux pour lui dire de remonter de 75 pixels afin de chevaucher l'image, on ne voit pas l'origine cet espace.
Une image <img> n'est pas faite pour être chevauchée par du texte, et en effet la bonne solution est de la mettre en background-image dans du CSS.
Ce que tu fais est un détournement sémantique !

J'espère que ça t'aide un peu.
A bientôt
Modifié par JuJu57 (11 Dec 2010 - 20:47)

Bonjour,

JuJu57 a écrit :

La &quot;place&quot; blanche sous ton image est réservée en théorie pour ton texte.
Mais étant donné que tu sors celui-ci du flux pour lui dire de remonter de 75 pixels afin de chevaucher l'image, on ne voit pas l'origine cet espace.
Une image &lt;img&gt; n'est pas faite pour être chevauchée par du texte, et en effet la bonne solution est de la mettre en background-image dans du CSS.
Ce que tu fais est un détournement sémantique !

Il y a surtout que l'on nous soumet un exemple sans élément de contexte (nature de l'image - décoration ou contenu, texte illustratif ou non etc.) permettant d'évaluer la pertinence de l'utilisation de cellules de tableau, de leur placement en background plutôt qu'en img HTML ou autre solution

Par ailleurs la page en ligne mériterait d'utiliser un DOCTYPE (quelqu’il soit) et d'en respecter sa syntaxe. Proposer dans l'état une réponse CSS sur une structure HTML hésitante n'ammènera à rien de bon

Au final la "ligne blanche sous l'image" est annecdotique

Avec ou sans contexte, on sait qu'un background est un background.
Une image est utilisé pour les autres utilisations, du moins, c'est ce que j'en pense.

Igor a raison au niveau du doctype, sauf si la page proposé est une page d'exemple fait à la va-vite pour illustrer ton souci.

A bientôt

JuJu57 a écrit :
Avec ou sans contexte, on sait qu'un background est un background.
Une image est utilisé pour les autres utilisations, du moins, c'est ce que j'en pense.

D'accord pour le background, encore faut-il savoir si cette image a sa place en image de décoration en background ou bien est-ce une image de contenu donc img HTML avec le alt qui va bien.

Sans une vrai page d'JYF nous n'en saurons rien.