28172 sujets

CSS et mise en forme, CSS3

Newsletter compatible gmail et hotmail

Bonjour,

Je suis en train de créer une newsletter en format HTML. Ma newsletter ne contient que des images. Le problème c'est que sur Gmail et Hotmail, il existe un espace entre les images Smiley decu
J'ai essayé la propriété style="display:block;" et border="0".. mais ça ne marche pas du tout

Help plz Smiley sweatdrop !!!!
salut,

je ne suis pas un expert, mais je sais que les mails au format HTML avec certains "webmails" c'est parfois pénible (expérience vécue)
il faut que ton code HTML soit le plus simple possible à interpréter.
il y a aussi tout plein de ressources sur le web pour t'informer.
vite fait : http://www.1stwebdesigner.com/tutorials/ultimate-guide-html-emails/
ou tu peux parcourir le code de "templates" existants.
vite fait : http://mailchimp.com/resources/html-email-templates/
Merci pour ta réponse.
Cependant, je voulais trouver une solution pour mon problème. Au fait, ma newsletter est une image qui a été travaillée sur Photoshop et qui a été découpée juste pour introduire des liens hypertextes.. Donc je n'ai pas vraiment besoin de templates. Je veux juste pouvoir régler l'espacement entre les images mais je ne sais pas comment faire Smiley confus
Bonjour,

Je ne m'y connais pas en intégration axée e-mailing, mais s'il s'agit d'un espace vertical, même si en théorie display: block; permet de s'en débarrasser, peut-être que ceci pourra régler le problème :
<img src="images/image.jpg" alt="" style="vertical-align: bottom;" />


S'il s'agit d'un espace horizontal, cela peut être dû au white-space qui se crée automatiquement selon l'indentation du code.

Aucun espace entre les images :
<img src="images/image_1.jpg" alt="" /><img src="images/image_2.jpg" alt="" />

Un espace blanc entre les images :
<img src="images/image_1.jpg" alt="" />
<img src="images/image_2.jpg" alt="" />
Merci pour ta réponse,
Je suis en train de tester avec un code très simple avec seulement 2 images: 
 <!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TEST</title>
</head>

<body>
<table width="800" border="0" cellspacing="0" cellpadding="0">
  <tr height="468">
    <td width="800" height="468" style="font-size:0px"><img src="img1.png" width="800" height="468" style="display:block;vertical-align: bottom;" border="0"/></td>
  </tr>

  <tr height="472">
    <td width="800" height="472" style="font-size:0px"><img src="img2.png" width="800" height="472" style="display:block;vertical-align: bottom;" border="0"/></td>
  </tr>
</table>

</body>
</html>


PS: Plateforme d'envoie Outlook 2010
Salut kittykat,

J'ai le même problème que toi, des espacements ennuyeux entre les images de mon template que j'ai découpé et que j'ai intégrer sur Dreamweaver.

Quant je colle ma newsletter dans le corp du texte de Outlook 2012, j'ai toujours des espaces entre les images.

Si tu as réussi à résoudre ce problème, tu peux me dire comme je pourrais en fin finir avec ce cauchemar.

Merci
linusMinus a écrit :
Salut kittykat,
Quant je colle ma newsletter dans le corp du texte de Outlook 2012, j'ai toujours des espaces entre les images.


Hello, question "con" mais pas tant que ça, tu te l'as envoyée ? Je dis ça car j'ai déjà eut le cas où l'éditeur visuel outlook dans mon cas ajoutait des espaces, mais une fois le mail envoyé, c'était bon.

Sinon un peu de CSS qui pourrait vous aider :


table td, table tr { border-collapse: collapse; }
Bonjour,

Je suis aussi confronté à ce problème ! Smiley ohwell Quelle galère !

Avez-vous trouvé une solution ?

D'avance merci beaucoup ! Smiley smile
Sujet clos
Aller à