28172 sujets

CSS et mise en forme, CSS3

Supprimer les marges dans un tableau

Bonjour,

je suis en train de créer une newsletter et j'ai ce fameux problème d'espace entre les images et le tableau.
En effet j'ai transformé les div PA en tableau sous dreamweaver et il m'a gentiment créé ces espaces.
Après avoir fouiné sur le web je ne vois pas de solutions...
Le pire c'est que c'est un problème que je rencontre régulièrement mais il est toujours sensiblement différent.

J'en viens à vous, chers communauté, aidez-moi!

Voici le code:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Graphisme & Webdesign</title>
</head>

<body>
<table border="0" cellpadding="0" cellspacing="0" cellmargin="0" >
<tr border="0" cellpadding="0" cellspacing="0" cellmargin="0">
<td width="650" height="289" colspan="4" valign="top"><img src="images/newsletterfinal_01.gif" width="650" height="289" border="0" margin="0" padding="0" ></td>
</tr>
<tr border="0" cellpadding="0" cellspacing="0" cellmargin="0">
<td width="221" height="251" valign="top"border="0" cellpadding="0" cellspacing="0" cellmargin="0"><img src="images/newsletterfinal_02.gif" width="221" height="251" border="0" margin="0" padding="0"></td>
<td width="429" height="251" colspan="3" valign="top"><img src="images/newsletterfinal_03.gif" width="429" height="251" border="0" margin="0" padding="0"></td>
</tr>
<tr>
<td width="650" height="82" colspan="4" valign="top"><img src="images/newsletterfinal_04.gif" width="650" height="82" border="0" margin="0" padding="0"></td>
</tr>
<tr>
<td width="221" height="317" valign="top"><img src="images/newsletterfinal_05.gif" width="221" height="317" border="0" margin="0" padding="0"></td>
<td width="210" height="317" colspan="2" valign="top"><img src="images/newsletterfinal_06.gif" width="210" height="317" border="0" margin="0" padding="0"></td>
<td width="219" height="317" valign="top"><img src="images/newsletterfinal_07.gif" width="219" height="317" border="0" margin="0" padding="0"></td>
</tr>
<tr>
<td width="650" height="81" colspan="4" valign="top"><img src="images/newsletterfinal_08.gif" width="650" height="81" border="0" margin="0" padding="0"></td>
</tr>
<tr>
<td width="650" height="76" colspan="4" valign="top"><img src="images/newsletterfinal_09.gif" width="650" height="76" border="0" margin="0" padding="0"></td>
</tr>
<tr>
<td width="650" height="74" colspan="4" valign="top"><img src="images/newsletterfinal_10.gif" width="650" height="74" border="0" margin="0" padding="0"></td>
</tr>
<tr>
<td width="325" height="50" colspan="2" valign="top"><img src="images/newsletterfinal_11.gif" width="325" height="50" border="0" margin="0" padding="0"></td>
<td width="325" height="50" colspan="2" valign="top"><img src="images/newsletterfinal_12.gif" width="325" height="50" border="0" margin="0" padding="0"></td>
</tr>
<tr>
<td width="325" height="50" colspan="2" valign="top"><img src="images/newsletterfinal_13.gif" width="325" height="50" border="0" margin="0" padding="0"></td>
<td width="325" height="50" colspan="2" valign="top"><img src="images/newsletterfinal_14.gif" width="325" height="50" border="0" margin="0" padding="0"></td>
</tr>
<tr>
<td width="650" height="44" colspan="4" valign="top"><img src="images/newsletterfinal_15.gif" width="650" height="44" border="0" margin="0" padding="0"></td>
</tr>
<tr>
<td width="221" height="1" valign="top"><img src="transparent.gif" alt="" width="221" height="1" border="0" margin="0" padding="0"></td>
<td width="104" height="1" valign="top"><img src="transparent.gif" alt="" width="104" height="1" border="0" margin="0" padding="0"></td>
<td width="106" height="1" valign="top"><img src="transparent.gif" alt="" width="106" height="1" border="0" margin="0" padding="0"></td>
<td width="219" height="1" valign="top"><img src="transparent.gif" alt="" width="219" height="1" border="0" margin="0" padding="0"></td>
</tr>
</table>
</body>
</html>


Merci

upload/55850-Capturede7.jpg
Bsr, pas vraiment compris ! L'espace entre les images et tableau ? Ou peut-être veux-tu parler des traits blanc ? Dans ce cas, il faut créer un cadre avec un fond de couleur identique aux cellules ou (tableaux imbriqués) que tu va insérer dedans.

border-spacing Espacement entre deux traits de cellules adjacentes.

Détermine l’espacement (le cas échéant) entre toutes les bordures des cellules d’un tableau. Cette propriété exige que la propriété border-collapse soit paramétré comme separate (il s’agit normalement de la valeur par défaut). Si vous ne spécifiez qu’une seule valeur de longueur, celle-ci est appliquée à l’espacement horizontal et vertical entre les cellules; si vous spécifiez deux valeurs, la première est appliquée à l’espacement horizontal et la seconde à l’espacement vertical.

Syntaxe CSS
border-spacing: longueur [ longueur ]
Valeur(s) possible(s) pour cette propriété :
Valeurs de longueur. Si vous ne voulez pas d’espacement le long d’un axe, spécifiez la valeur zéro.

Valeur initiale
0

S’applique à
L’élément table .
Modifié par marcopolo29 (26 Aug 2014 - 22:37)
Bonjour,

Tout comme Raphael, je n'ai pas eu le courage non plus.

En complément à la réponse de marcopolo29 j'ajoutterai qu'il existe la propriété CSS suivante en ce qui concerne les TABLE

TABLE {
BORDER-COLLAPSE:COLLAPSE;
}


Border-Collapse s'applique sur l'élément TABLE et défini si l'ensemble des cellules de la table sera représenté de manière imbriquée (sans espace entre les cellules) ou de manière séparée (chaque cellule est séparée par un intervalle en haut, en bas, à gauche et à droite.


Si ça peut aider ma foi...


Bonne journée
Sujet clos
Aller à