[XHTML]Problème avec <img> et margin-bottom

**Locelot** · 06/09/2005, 11h24

Bonjour,

Alors voila, je mets mon site à la norme XHTML 1.1 (strict) mais j'ai un problème avec les images car un espacement se met juste en bas. Cela ne se fait pas avec HTML.
J'ai changé le style avec les CSS: margin=0; ou margin-bottom=0; mais cela ne change rien.
J'utilise Mozilla Firefox sous Mandriva.

Quelqu'un a-t-il le même problème ou mieux... la solution! Merci!

**MasterOfChakhaL** · 06/09/2005, 12h10

il me semble que tu dois préciser dans quelle unité tu parles (em, px...)

**Locelot** · 06/09/2005, 12h17

Envoyé par MasterOfChakhaL

il me semble que tu dois préciser dans quelle unité tu parles (em, px...)

Oups, j'ai oublié de la mettre dans mon message car c'est obligatoire mais quelque soit l'unité, cela ne fonctionne pas. Merci quand même

**Huntress** · 06/09/2005, 12h48

Montre nous réellement ton code.

**Locelot** · 06/09/2005, 13h13

Voici par exemple un code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Titre</title>
<style type="text/css">
img
{
margin-bottom:0px;
}
</style>
</head>
<body>
<img src="image.png" /><br /><img src="image.png" />
</body>
</html>

Avec ce code, il y a une marge en bas de chaque image mais le margin-bottom ne change rien. D'ailleurs quand je fais "margin-bottom:1px;", cette marge est augmentée d'1 pixel, le problème doit donc être ailleurs et j'ai bien peur qu'il n'y ait pas de solution.

**Nesmontou** · 06/09/2005, 16h04

C'est peut-être une propriété border qui se balade

:

**Locelot** · 12/09/2005, 19h09

Envoyé par Nesmontou

C'est peut-être une propriété border qui se balade

:

Non, border="0" ne change rien!

Merci quand même

**zazaraignée** · 12/09/2005, 21h52

Salut

Je crois que c'est à cause du baseline (ou quelque chose comme ça, je ne sais plus le nom). Le bas de ton image est aligné sur la ligne de base d'une ligne de texte. l'espace qui reste en bas sert pour les pattes des lettres qui descendent comme les p, q, g et autre du genre. Et se rajoute l'espacement minimum entre chaque ligne. Exemple pour du caractère 11pt chaque ligne aura une hauteur de 12pt.

Donc tu dois modifier l'alignement de ton image par rapport à une ligne normale de texte pour éviter cette situation... du moins, il me semble.

**Locelot** · 12/09/2005, 22h02

Bonsoir,
Merci beaucoup zazaraignée, grâce à toi, j'ai la solution.
Il suffit de changer le vertical-align:
img
{
vertical-align:bottom;
}

[XHTML]Problème avec <img> et margin-bottom

HTML

Discussions similaires

Partager

Partager