marge entre img et border

[ddebin]

Bonjour,

Ca fait plusieurs jours que je me tire les cheveux sur ce problème, vous pourrez peut-être m'aider...

La page de test est http://ddebin.free.fr/test/test.html

En XHTML+CSS, je cherche à coller le bord en pointillé en bas à l'image mais rien à faire (alors que pour moi d'après le code, ça devrait être collé)... alors que le bord d'en haut est bien collé (je précise que je ne veux pas passer par l'attribut CSS "border" de l'IMG).

Le problème apparait avec Firefox 1.0 mais pas avec IE... je doute que le problème vienne d'un bug ou d'un mauvais rendu de firefox (enfin j'espère).

Si vous pouviez me donner un coup de main

Damien

[Dan]

Salut ddebin, et bienvenue à bord du Hub !

Le #photozone que tu déclares dans ton CSS, tu l'utilises ou ?

Dan

[Nissone]

Sans conviction aucune, essaye line-height:0

[ddebin]

Salut ddebin, et bienvenue à bord du Hub !

Le #photozone que tu déclares dans ton CSS, tu l'utilises ou ?

Dan

<{POST_SNAPBACK}>

Ok pour le photozone J'ai été un peu vite à faire mon exemple, mais ça ne règle pas le problème... (j'ai corrigé la page de test).

Dam

[MissMonde]

Salut,

il faut rajouter à img {display:block;}

je crois qu'il y a un sujet là-dessus sur le hub, mais je ne sais plus où.

[ddebin]

Sans conviction aucune, essaye line-height:0 

<{POST_SNAPBACK}>

Merci a Nissone pour cette idée, ça résout effectivement le problème. line-height est une propriété que je ne connaissais pas et intervient dans le calcul des box quand le navigateur effectue le rendu de la page. Mais son utilisation n'est pas très claire.

Une autre solution (liée à la première) serait effectivement de passer l'image en display:block, le problème est que j'ai en fait plusieurs images sur la même ligne, et du coup elle serait alignées verticalement (à moins d'utiliser en plus des float).

Je reste donc sur la première solution.

Merci pour votre aide.

Damien

Modifié 22 Novembre 2004 par ddebin

[Hadrien]

La solution est la suivante :

vertical-align: bottom;