Se connecter avec
S'enregistrer | Connectez-vous

E Mail HTML + CSS prob.

Dernière réponse : dans Programmation

Bonjour à tous,
J'ai une question,
J'essaye depuis plusieur temps d'envoyer un mail HTML à une liste de contats. J'utilise MaxBulk et j'en suis assez content. J'arrive à envoyer tout mais je dois dire que l'effet voulu n'est pas du tou bien recu. Pourtant l'aprecu avant l'envoi est parfait mais quand on le recoit (avec Hotmail, Skynet.be et Outlook en tout cas) le fond du mail est désespérément... Blanc on dirait un mail des plus normal.
Voici quelques infos:
les code:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" target="_blank">http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd</a>">
  2.  
  3. <html xmlns="<a href="http://www.w3.org/1999/xhtml" target="_blank">http://www.w3.org/1999/xhtml</a>" xml:lang="fr" lang="fr">
  4.    <head>
  5.  
  6.         <title>Mail | Boulledogue Corp.</title>
  7.         <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  8. <title>Boulledogue Corp.</title>
  9. <META NAME="description" CONTENT="Site de télécharements, et de publicité de blogs, skyblogs, o site internet. Muni d\'un forum avec plein de lien de tééchargements.">
  10. <META NAME="keywords" CONTENT="Guillaume, Normand, guillaume, normand, boulledogue, Boulledogue, site, téléchargements, warez, Warez, forum, corp., corp, logiciels, musiques, musique, logiciel, jeux, jeu, film, films, forum, blabla, skyblog, blog, site internet, publicité,">
  11. <META NAME="subject" CONTENT="Informatique, général">
  12. <LINK REL="Generateur-meta" href="<a href="http://www.cclleemm.com/" target="_blank">http://www.cclleemm.com/</a>" />
  13. <META NAME="author" CONTENT="Guillaume Normand">
  14. <META NAME="copyright" CONTENT="©">
  15. <META NAME="revisit-after" CONTENT="1">
  16. <META NAME="identifier-url" CONTENT="<a href="http://www.guillaumenormand.fr.tc" target="_blank">http://www.guillaumenormand.fr.tc</a>">
  17. <META NAME="reply-to" CONTENT="guillaume.normand@hotmail.com">
  18. <META NAME="date-creation-ddmmyyyy" CONTENT="20022007">
  19. <META NAME="Robots" CONTENT="all">
  20. <META NAME="Rating" CONTENT="general">
  21. <META NAME="organization" CONTENT="Boulledogue Corp.">
  22. <META http-equiv="Content-Language" CONTENT="Be">
  23. <META NAME="expires" CONTENT="never">
  24. <META NAME="Distribution" CONTENT="Global">
  25. <META NAME="Audience" CONTENT="general">
  26.         <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  27.         <meta http-equiv="Content-Language" content="fr" />
  28.            <meta http-equiv="Content-Script-Type" content="text/javascript"/>
  29.            <meta http-equiv="Content-Style-Type" content="text/css"/>
  30.         <meta name="DC.Language" scheme="RFC3066" content="fr"/>
  31.  
  32.         <link rel="stylesheet" href="style.css" type="text/css" media="screen" title="Normal" />
  33.  
  34.         <style type="text/css">
  35. html { height:100%; }
  36.  
  37. body {
  38. 	margin:0;padding:0;
  39. 	background-color:#4B738D;
  40. 	font-family:"Trebuchet MS", Verdana, Sans-Serif;
  41. 	font-size:0.7em;
  42. 	color:#454545;
  43. 	height:100%;
  44. }
  45.  
  46. a { color:#3A586C;text-decoration:underline; }
  47.  
  48. a:hover { color:#7BB5DB;text-decoration:none; }
  49.  
  50. #splash {
  51.     position:absolute;
  52.     left: 50%; 
  53.     top: 50%;
  54.     width: 531px;
  55.     height: 234px;
  56.     margin-top: -117px;
  57.     margin-left: -265px;
  58.     border: 1px solid #000;
  59. 	border:none;
  60. }
  61.  
  62. #page {
  63. 	margin:0 auto 0 auto;
  64. 	background:url('images/interface/fond.png') repeat-y;
  65. 	width:768px;
  66. 	position: relative;
  67.     min-height: 100%
  68. }
  69.  
  70. h1#logo {
  71. 	text-indent:-9000px;
  72. 	background:url('images/interface/logo.png') no-repeat;
  73. 	width:239px;
  74. 	height:79px;
  75. 	margin:auto;
  76. 	position:relative;
  77. 	top:20px;
  78. 	background-image: url(images/interface/logo.png);
  79. }
  80.  
  81. #contenu {
  82. 	background-color:#303030;
  83. 	width:669px;
  84. }
  85.  
  86. .bloc {
  87. 	background:url('images/interface/haut_bloc.png') top no-repeat #FFF;
  88. 	width:669px;
  89. 	text-align:justify;
  90. 	margin:40px 47px;
  91. 	padding-top:10px;
  92. }
  93.  
  94. #menu {
  95.  
  96. 	width:100%;
  97. }
  98.  
  99. #menu ul {
  100. 	padding:0;margin-left:4px;padding-bottom:15px;
  101. 	list-style-type:none;
  102. 	clear:both;
  103. }
  104.  
  105. #menu li {
  106. /*	width:220px; */
  107. 	height:24px;
  108. 	display:inline;
  109. 	text-align:center;
  110. }
  111.  
  112. #menu a {
  113. 	display:block;
  114.  
  115. 	float:left;
  116. 	width:146px; 
  117. 	margin-right:1px;
  118. 	height:24px;
  119. 	background-color:#E8E8E8;
  120. 	padding-top:6px;
  121. 	color:#303030;
  122. 	text-decoration:none;
  123. 	font-size:110%;
  124. 	text-align:center;
  125. }
  126.  
  127. #menu a:hover {
  128. 	display:block;
  129. 	width:220px;
  130. 	height:24px;
  131. 	background-color:#4B738D;
  132. 	color:#FFF;
  133. 	text-decoration:underline;
  134. }
  135.  
  136. .bloc p{
  137. 	padding:0 5px 0 5px;
  138. }
  139.  
  140. .bloc p:first-letter {
  141. 	padding-left:15px;
  142. 	font-weight:bold;
  143. 	font-size:130%;
  144. }
  145.  
  146. .bloc h2 {
  147. 	background:url('images/interface/fond_titre.png') no-repeat;
  148. 	width:153px;
  149. 	height:36px;
  150. 	font-size:110%;
  151. 	color:#FFF;
  152. 	text-align:center;
  153. 	margin-left:10px;
  154. 	font-weight:normal;
  155. 	padding-top:10px;
  156. 	clear:both;
  157. }
  158.  
  159. .bas_bloc {
  160. 	width:669px;
  161. 	height:5px;
  162. 	background:url('images/interface/bas_bloc.png') bottom no-repeat; 
  163. }
  164.  
  165. #copyright {
  166. 	font-size:90%;
  167. 	color:#FFF;
  168. 	text-align:center;
  169. 	width:100%;
  170. 	position:absolute;
  171. 	bottom:0;
  172. }
  173.         </style>
  174. </head>
  175.  
  176. <body>
  177. <div id="page">
  178.  
  179. 	<h1 id="logo"></h1>
  180.  
  181. 	<div class="bloc">
  182.  
  183. 	<div id="menu"></div>
  184.  
  185. 	<center>
  186. 	  <h2>Mail</h2>
  187. 	</center>
  188. 		<div dir="ltr">
  189.           <p>Bonjour à toi,</p>
  190.           <p>JE vous envoie ce mail (jespere que vous l'avez recu correctement) pour vous présenter le design de mon site web.</p>
  191.           <p>Mon site offre toujours des téléchargements de films (Spiderman 3,                Le Transporteur 2, Taxi 4, ...) des jeux (GTA: S.A.) et de la musique et le tout GRATUITEMENT!</p>
  192.           <p>Voici le lien:</p>
  193.           <p><a href="<a href="http://www.guillaumenormand.fr.tc" target="_blank">http://www.guillaumenormand.fr.tc</a>"><a href="http://www.guillaumenormand.fr.tc&lt" target="_blank">http://www.guillaumenormand.fr.tc&lt</a>;/a>  </p>
  194.           <p>et le forum (sur lequel se trouvent la plupart des téléchargements:</p>
  195.           <p><a href="<a href="http://www.guillaumenormand.keuf.net" target="_blank">http://www.guillaumenormand.keuf.net</a>"><a href="http://www.guillaumenormand.keuf.net&lt" target="_blank">http://www.guillaumenormand.keuf.net&lt</a>;/a> </p>
  196.           <p>Un grand merci à toi d'avoir prêté toute ton attention à mon message et je te souhaite une bonne visite de mon site internet.</p>
  197.           <p>Boulledogue (Webmaster, Admin, ExPeRt wArEz, ...) <br />
  198.           </p>
  199. 		</div>
  200. 		<div class="bas_bloc"></div>
  201. 	</div>
  202.  
  203. 	  <!-- 
  204. 	  <div class="bloc">  <div class="bas_bloc"></div></div>
  205. 	  !-->
  206. 	  <div><p> </p></div>
  207. <div id="copyright">
  208. 		<p><a href="<a href="http://cclleemm.com/rss_manager/rss.php?xml=guillaumenormand.fr.tc-1" target="_blank">http://cclleemm.com/rss_manager/rss.php?xml=guillaumeno...</a>"><img src="<a href="http://www.cclleemm.com/rss_manager/boutons/rss_logo%201.png" target="_blank">http://www.cclleemm.com/rss_manager/boutons/rss_logo%20...</a>" border="0" /></a> Design Web construit par <a href="mailto:contact@richie3366.com">Richie3366</a> merci à lui pour son aide précieuse  <script type="text/javascript" src="<a href="http://raussin.clement.free.fr/stats/php-stats.js.php?pseudo=ptitguilou" target="_blank">http://raussin.clement.free.fr/stats/php-stats.js.php?p...</a>"></script>
  209. <noscript><img src="<a href="http://raussin.clement.free.fr/stats/php-stats.php?pseudo=ptitguilou" target="_blank">http://raussin.clement.free.fr/stats/php-stats.php?pseu...</a>" border="0" alt=""></noscript></p>
  210.   </div>
  211. </div>
  212. </body>
  213. </html>


Effet voulu: http://www.guillaumenormand.fr.tc/mail.html ...
Si quelqu'un pouvait m'aider ca serait super sympa.
Merci!
@+
Boulledogue

Autres pages sur : mail html css prob

Lassé par la pub ? Créez un compte
Lassé par la pub ? Créez un compte

Répondre Créer un nouveau sujet

Tom's guide dans le monde