Marge en haut en bas dans une table

**Steph4fun** · 26/02/2007, 21h53

Bonjour,

Question bête (et surement simple) mais je galère dessus depuis plusieurs heures et je m'en sort pas...
J'ai un code html tout simple que voilà :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<html>
<head>
   <title>Test</title>
</head>
<body>
<table border="1" cellpadding="0" cellspacing="0">
   <tr>
      <td>
         <img src="ligne.gif" width="985" height="4" border="0" />
      </td>
   </tr>
</table>
</body>
</html>

Je ne comprend pas pourquoi sous IE6/IE7 la hauteur de la "ligne" de ma table ne correspond pas à la hauteur de mon image (4 pixels)
Il y a un espacement en haut et en bas, comme si j'avais défini des marges... (La bordure de ma table n'encadre pas ma ligne.gif)
Si je rajoute un valign="top", ma ligne remonte mais j'ai toujours cette marge.

En revanche, cela fonctionne très bien sous Firefox...

Merci
Steph

**blueice** · 27/02/2007, 07h48

Ne sachant pas ce que tu souhaites faire, voici deux solutions :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Untitled</title>
    <style type="text/css" title="text/css">
/* <![CDATA[ */
* { margin:0; padding:0; }
#cadre { width:985px; height:4px; border:1px solid black; }
img { border:none; }
/* ]]> */
</style>
</head>
<body>
<div id="cadre">
         <img src="ligne.gif" />
</div>
</body>
</html>

ou encore plus simple:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Untitled</title>
    <style type="text/css" title="text/css">
/* <![CDATA[ */
* { margin:0; padding:0; }
#cadre { width:985px; height:4px; border:1px solid black; background-color:red;}
img { border:none; }
/* ]]> */
</style>
</head>
<body>
<div id="cadre"></div>
</body>
</html>

**Steph4fun** · 02/03/2007, 22h17

Merci pour ta réponse Blueice, mais ça me donne le même résultat (avec l'exemple 1). J'ai toujours une sorte de marge dans la table avec IE...
Ca m'énerve car je sais pas trop pourquoi...
J'ai rien à faire de précis, c'est juste une sorte de test...
Merci