Comunidad de diseño web y desarrollo en internet online

Problema con la creacion de un html/mail

Citar            
MensajeEscrito el 17 Dic 2007 10:56 pm
he buscado en el foro de clab, pero no encuentro la respuesta a la duda que me surge... he creado el archivo html que quiero enviar por correo... es decir quiero que el correo sea el archivo html... como hacen las diferentes empresas de publicidad, el resultado ha sido que solo me sale el texto y no me coje las css... cosa que hace que todo mi trabajo se valla a la mierda.... me podriais ayudar, este es el mail.

Código :

<!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=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
<!--
a:link {
   color:#3D7584;
   text-decoration: none;
   outline:none;
}
a:focus {
    outline:none;
}
a:visited{
   color: #3E3E3E;
   text-decoration: none;
   outline:none;
}
#cuerpo {
   background-image: url(http://avaltel.com/chrismas/images/fondo.jpg);
   background-repeat: no-repeat;
   background-position: left bottom;
   height: 727px;
   width: 514px;
   border: thin solid #002e39;
   float: left;
}
.td_men{
   font-family: Arial, Helvetica, sans-serif;
   font-size: 14px;
   font-weight: 500;
   color: #3d7584;
   border-bottom:solid thin #3e3e3e;
   background-image:url(http://avaltel.com/chrismas/images/fd_deg_men.jpg);
   background-position:left bottom;
   background-repeat:repeat-x;
   padding-bottom:10px;
   padding-top: 10px;
}
.td_men_ult{
   font-family: Arial, Helvetica, sans-serif;
   font-size: 32px;
   font-weight: bold;
   color: #3e3e3e;
}
#texto {
   float: right;
   height: 100px;
   width: 296px;
   margin-bottom: 10px;
}
#pomp_sup {
   background-image: url(http://avaltel.com/chrismas/images/fd_pomp_sup.jpg);
   background-repeat: no-repeat;
   background-position: center bottom;
   float: right;
   height: 75px;
   width: 296px;
}
#pomp_de {
   background-image: url(http://avaltel.com/chrismas/images/fd_pomp_de.jpg);
   background-repeat: no-repeat;
   background-position: left center;
   float: right;
   height: 200px;
   width: 44px;
}
#pomp_iz {
   background-image: url(http://avaltel.com/chrismas/images/fd_pomp_iz.jpg);
   background-repeat: no-repeat;
   background-position: left center;
   float: left;
   height: 200px;
   width: 44px;
}
#pomp_inf {
   background-image: url(http://avaltel.com/chrismas/images/fd_pomp_inf.jpg);
   background-repeat: no-repeat;
   background-position: center top;
   float: right;
   height: 50px;
   width: 296px;
}
#cuadro {
   margin-top: 60px;
   margin-right: 15px;
   width: 385px;
   float: right;
}
#pie {
   width: 500px;
   height: 50px !important;
   height: 15px;
   margin-top: 418px;
   float: right;
   text-align: right;
   margin-right: 10px;
}
#tarjeta {
   height: 217px;
   width: 400px;
   border: thin solid #002e39;
   z-index: 1;
   background-color: #FFFFFF;
}
#contacto {
   height: 200px;
   width: 400px;
   border: thin solid #002e39;
   z-index: 1;
   background-color: #FFFFFF;
   margin-top: 15px;
}
#tar_panel_de {
   width: 1px;
    margin-top: 350px;
   margin-left: -300px;
    float: left;
}
#tit_tarj {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 16px;
   margin: 13px;
   text-align: center;
   font-weight: bold;
   border-bottom-width: thin;
   border-bottom-style: solid;
   border-bottom-color: #3E3E3E;
   background-image: url(http://avaltel.com/chrismas/images/fd_deg_men.jpg);
   background-repeat: repeat-x;
   background-position: left bottom;
   color: #3D7584;
   padding-bottom: 10px;
}
.txt_peq{
   font-family: Arial, Helvetica, sans-serif;
   font-size: 8px;
}
.txt_carta{
   font-family: Arial, Helvetica, sans-serif;
   font-size: 12px;
   color: #3D7584;
}
#mensaje {
   margin: 13px;
   height: 100px;
   width: 374px;
}
#mensaje b{
   color: #3E3E3E;
}
#tar_panel_de ul {
   margin: 0px;
   padding: 0px;
}
#tar_panel_de li {
   display:inline;
   border-right-width: 1px;
   border-right-style: solid;
   border-right-color: #000000;
   margin-right: 7px;
   padding-right: 7px;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 11px;
   color: #3D7584;
}
#menu_cont {
   padding-bottom: 0px;
   background-image: url(http://avaltel.com/chrismas/images/fd_deg_men.jpg);
   background-repeat: repeat-x;
   background-position: left bottom;
   margin-top: 37px;
   margin-right: 0px;
   margin-bottom: 0px;
   margin-left: 0px;
   padding-left: 15px;
}
#logo {
   text-align: center;
   margin-top: 20px;
}
-->
</style>
</head>

<body>
<div id="cuerpo">
  <div id="cuadro">
    <div id="pomp_de"></div>
   <div id="pomp_sup"></div>
   <div id="pomp_iz"></div>
    <div id="texto">
      <table> 
       <tr>
         <td class="td_men">
            Los sueños son sumamente importantes.<br/>
            Nada se hace sin que antes se imagine.
        </td>
       </tr>
       <tr>
         <td></td>
       </tr>
       <tr>
         <td class="td_men_ult">FELIZ NAVIDAD</td>
       </tr>
     </table>
    </div>
    <div id="pomp_inf"></div>
  </div>
  <div id="pie">
    <span class="txt_peq">
     Se reservan todos los derechos de uso por la entidad A | VAL | TEL © 2007, La frase utilizada es propiedad de George Lucas.   </span>  </div>
</div>
<div id="tar_panel_de">
<div id="tarjeta">
  <div id="tit_tarj"><a href="http://www.avaltel.com/contacto/"><img src="http://avaltel.com/chrismas/images/logo.jpg" border="0" /></a></div>
  <div id="mensaje">
    <span class="txt_carta">
     Quiz&aacute;s en este &uacute;ltimo mes en gran medida he podido apreciar el gran trato y atenci&oacute;n que me han prestado ante una situaci&oacute;n complicada, como ha sido mi estancia de baja, es por ello que <b>deseo agradecerles su dedicaci&oacute;n</b> en general y en mi caso particular. <br/>
     <b><br/>
     Sin duda es de justicia felicitarles tanto por su trabajo como por su profesionalidad, y desearle por tanto unas felices fiestas</b>.</span>
  </div>
  <div id="menu_cont">
    <ul>
     <li><a href="http://www.avaltel.com/contacto/">CONTACTO</a></li>
     <li><a href="cv">CV</a></li>
     <li>T&eacute;cnico Formaci&oacute;n &amp; RR.HH. </li>
   </ul>
  </div>
</div>
</div>
</body>
</html>

Por Theos

70 de clabLevel



 

firefox
Citar            
MensajeEscrito el 22 Dic 2007 06:15 pm
Este es uno de los grandes problemas de los newsletters, asi es como se llama el archivo html que quieres enviar por correo.
Muchos de los gestores de correo electronico no leen muy bien el css por lo que mucha gente opta por maquearlos y diseñarlos solo con HTML.

Por Pitxon

38 de clabLevel



Genero:Masculino  

Madrid

firefox
Citar            
MensajeEscrito el 23 Dic 2007 12:49 pm
no te lo he podido decir hasta ahora por no ir haciendo spam por los diferentes topic poniendo lo mismo, pero gracias por contestar, tus opiniones valen de mucho en el foro, lo solucione haciendolo directamente con una tabla y aplicando style.... pero gracias.... y feliz navidad.

Por Theos

70 de clabLevel



 

firefox
Citar            
MensajeEscrito el 26 Dic 2007 05:16 pm
Yo tenía el mismo problema que tú y lo solucioné volviendo a utilizar tablas y las denostadas etiquetas font que ya tenía olvidadas. El problema es que cada cliente de correo electrónico interpreta los estilos a su manera.

Por nachoseo

15 de clabLevel



 

firefox
Citar            
MensajeEscrito el 26 Dic 2007 10:32 pm

nachoseo escribió:

Yo tenía el mismo problema que tú y lo solucioné volviendo a utilizar tablas y las denostadas etiquetas font que ya tenía olvidadas. El problema es que cada cliente de correo electrónico interpreta los estilos a su manera.
Tablas es la opción... y en lugar de font, usas CSS dentro de "style" para cada elemento...

Por Pedro

BOFH

3017 de clabLevel

3 tutoriales
6 articulos

  Bastard Operators From Hell

Honduras

firefox
Citar            
MensajeEscrito el 28 Dic 2007 12:20 am
sep, asi fue como finalmente lo resolvi ^^

Por Theos

70 de clabLevel



 

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.