css - email

evoarte · #1 (**permalink**) 17/02/2007, 16:20

buenas noches:

es la primera vez que envío un correo con estilo, la pagina se visualiza bien con explorer y firefox, pero en outlook y en otro webmail que lo he probado no, y no se muy bien que hacer.

hay alguna particularidad al abrir una pagina web con un cliente de correo como outlook o bien desde internet con webmail ?

salu2.

Gurrutello · #2 (**permalink**) 17/02/2007, 19:03

Hola
Outlook y otros suelen bloquear los estilos
Pero si el usuario acepta mostrarlos, se mostraran
ahora, en tu email si tienes un css externo asegurate que la direccion del css include es completa
ej.
<link rel="stylesheet" type="text/css" href="http://www.tuweb.cam/css/estilos.css" />
Normalmente los mails que mando suelen tenerlo incluido de esta manera, nunca en el codigo directamente.
Saludos

evoarte · #3 (**permalink**) 17/02/2007, 19:24

buenas noches:

igual da, al menos en este caso, que incluya el código css en la pagina que se muestra en el correo, o que sea externo.

ocurre que el div id="ventana" que tiene un borde no envuelve todo el documento, solo envuelve al div id="logo", cuando debería incluirlo todo.

<div id="ventana">
<div id="logo"></div>
<div id="espacio"></div>
<div id="contenido">
<div id="accionA">
<div id="centro"></div>
</div>
<div id="accionB"></div>
</div>
</div>

#ventana
{width:auto;height:auto;
margin:10px;
border:1px solid #ff9b37;
padding:5px 5px 5px 5px;
}
#centro
{text-align:center; }

#logo
{float:left;}

#contenido
{clear:both;overflow:auto;}

#contenidoA
{clear:both;float:left;
width:170px;height:250px;
padding:15px 5px 5px 5px;
border:1px solid #ff9b37;
margin:0px 0px 10px 0px;
overflow:auto;}

#contenidoB
{float:right;
width:550px;height:250px;
padding:15px 5px 5px 5px;
border:1px solid #ff9b37;
margin:0px 0px 10px 0px;
overflow:auto;}

#accionA {clear:both;float:left;}
#accionB {float:right;}

salu2.

Panino5001 · #4 (**permalink**) 18/02/2007, 07:22

Para que el css funcione en todos los webmails hay que aplicarlo inline. Hotmail elimina las etiquetas <style[...]>...</style> colocadas entre <head></head>, entonces algunos optan por colocarlas entre los tags <body></body>. Si bien eso funciona en hotmail, no funciona por ejemplo en Gmail, que elimina los tags <style[...]>...</style> en dondequiera que se encuentren (imagino que tanta censura será para no afectar sus propios estilos o evitar alguna inclusión htc).
Lamentablemente, lo que funciona en todos lados es aplicar el estilo a cada elemento con el atributo style (es decir, inline).