18041 sujets

Questions générales et questions de débutants

[Résolu] Mise en page tableau pour newsletter

Salut,

je suis en train de m'inspirer d'une Newsletter de chez "pas de pub".

Etant donné qu'il s'agit d'un document à faire parvenir par email, dans le souci de ne pas perdre ma mise en forme et d'éviter le casse tête des différentes compatibilités avec clients emails, je travaille avec des tableaux. Smiley biggol Smiley biggol . Oui, autant pour moi Smiley langue

J'ai un tableau de 100% et un padding body de 3% etc.

Le problème que je rencontre, c'est que mes séparations (en bas) font 2 pixels au lieu de 1, parce que les td qui se touchent valent chacun 1 px et donc, côte à côte, ça grossit mon trait... Voir illu


body,td,th {font-family: Arial, Helvetica, sans-serif;}
body {margin: 3%;}
td {border: 1px solid #CCCCCC;}
img{margin-bottom: 20px;}
h1 {font-size: 22px;
	color: #333333;
	font-weight: lighter;}
h2 {color: #999999;
	font-size: 14px;
	line-height: 2;
	font-weight: lighter;}
h3 {font-size: 15px;
	color: #333333;
	line-height: 0;
	font-weight: lighter;
	margin-top: 0px;}
h4 {color: #999999;
	font-size: 13px;
	font-weight: lighter;
	margin-bottom: 0px;}



<table width="100%" border="0" cellpadding="20" cellspacing="00" bordercolor="#CCCCCC" bgcolor="#FAFAFA">
  <tr>
    <td colspan="3"><img src="LOGO.jpg" /><br /><h1>Vous y êtes presque</h1>
      <h2>Bienvenue dans xxxxxxxxx, bisse. Avant de commencer, nous devons contrôler rapidement votre adresse électronique. </h2>
      <h2>Cliquez sur le lien ci-dessous et connectez-vous avec votre nouvel ID  : xxxxxxxxxx.	 
      Confirmez votre adresse électronique. </h2>
      <h2>Une fois l’adresse confirmée, connectez-vous à xxxxxx pour démarrer. </h2>
      <h2>Nous sommes heureux de vous compter parmi nous,
    L’équipe xxxxxx</h2></td>
  </tr>
  <tr>
    <td><h3>Obtenez vite des réponses!</h3>
    <h4>Nous sommes heureux de vous compter parmi nous,
    L’équipe xxxxx xxxxxx</h4></td>
    <td><h3>Votre compte</h3>
    <h4>Affichez les détails et paramètres de votre compte.</h4></td>
    <td><h3>Besoin d'aide?</h3>
    <h4>Contactez le Service clientèle si vous rencontrez un problème.</h4></td>
  </tr>
</table>


upload/14508-01.gif

Auriez-voous une piste de réflexion?
Modifié par FranZz (08 Nov 2013 - 13:56)
Ok, j'ai résolu mon prob (au cas ou quelqu'un rencontre ce stress) en personnalisant mes td's problématiques, du genre:

td.section1 {
	border-left-color: #CCCCCC;
	border-bottom-color: #CCCCCC;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-left-width: 1px;
	border-left-style: solid;
}

Modifié par FranZz (08 Nov 2013 - 14:49)
Sujet clos
Aller à