Bordure à gauche sur tableau

[Chiffon56]

Bonjour à tous,
Voici mon probleme :
je souhaite faire un tableau dont l'entete est une image sans bordure, mais dont le corps à des bordures qui rejoignent cette image.
Le CSS:

Code css :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 
*{
	margin:0;
	padding:0;
}
 
table
{
	border:0;	
	padding:0;
	width:200px;
	border-collapse:collapse;
	margin:auto;
	margin-top:100px;
}
.fondDegrade
{
	background:url('entete.png');
	width:200px;
	height:40px;
	margin:0;
	padding:0;
}
td
{
	border:1px black solid;
	margin:0;
	padding:0;
}

et le HTML :

Code html :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
<table>
	<thead>
		<tr class="fondDegrade">
        	<th>colonne 1</th>
            <th>colonne 2</th>
    	</tr>
    </thead>
    <tbody>
    	<tr>
        	<td>cellule 1</td>
            <td>cellule 2</td>
        </tr>
        <tr>
        	<td>cellule 3</td>
            <td>cellule 4</td>
        </tr>
        <tr>
        	<td>cellule 5</td>
            <td>cellule 6</td>
        </tr>
    </tbody>
</table>

(l'image fait 200x40)
Dans cette configuration, la bordure de droite du tableau est bien alignée avec l'image de titre.
Mais la bordure de gauche dépasse à gauche du tableau d'1px !
Je me suis arraché un moment les cheveux sur la question et définitivement, je trouve pas (et pourtant ça doit être très simple).

Qqun connaît-il ce problème et peut-il m'aider ??

Je précise que le navigateur sur lequel ça doit être fonctionnel est firefox 4+, et bien sur si possible IE7+ et chrome, moins prioritaires. Pour l'instant ce code est de toute façon très mal affiché par IE et chrome.

Merci beaucoup !

Chiffon

[NoSmoking]

Bonjour,
mets
- le background sur la table
- le fond des cellules en blanc
- et ajoutes

Code :

1
2
3
thead tr {
  border : 1px solid transparent;
}