Envio de correo formato html

BuckInc · #1 (**permalink**) 01/06/2011, 11:26

He estado haciendo pruebas de envio de un correo electronico, el envio lo estoy haciendo en este momento en thunderbird

El proceso que realizo es a partir de un jpg tanto en fireworks como en photoshop corto la imagen en capas y la exporto como html junto con sus imagenes recortadas.

Ahora bien la carpeta de imagenes la subo a un servidor y posteriormente del archivo html ligo de manera absoluta cada img src"http://www.midominio.com/micarpeta_de_imagenes/mi_imagen.jpg/gif etc.."

Como siguiente paso el archivo lo envio a través de thunderbird.. esto en formato html..

el problema que tengo es que el correo llega a hotmail sin problemas.. pero en gmail entre cada corte horizontal de la imagen me deja un espacio en blanco.. y esa linea en blanco hace que se distorcione toda la tabla..

a continuacion pondre un fragmento del codigo:

<html>
<head>
<title>update.jpg</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<style type="text/css">td img {display: block;}</style>
</head>
<body bgcolor="#ffffff" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table border="0" cellpadding="0" cellspacing="0" width="703" style="display:inline-block;">

<tr>
<td colspan="7"><img name="update_r1_c1" src="http://www.midominio/imgB/update_r1_c1.jpg" width="703" height="117"></td>
<td width="1" height="117"><img src="http://www.midominio/imgB/spacer.gif" width="1" height="117"></td>
</tr>
<tr>
<td colspan="7"><img name="update_r2_c1" src="http://www.midominio/imgB/update_r2_c1.jpg" width="703" height="123"></td>
<td width="1" height="123"><img src="http://www.midominio/imgB/spacer.gif" width="1" height="123"></td>
</tr>
<tr>
<td colspan="7"><img name="update_r3_c1" src="http://www.midominio/imgB/update_r3_c1.jpg" width="703" height="203"></td>
<td width="1" height="203"><img src="http://www.midominio/imgB/spacer.gif" width="1" height="203"></td>
</tr>
<tr>
<td colspan="7"><img name="update_r4_c1" src="http://www.midominio/imgB/update_r4_c1.jpg" width="703" height="240"></td>
<td><img src="http://www.midominio/imgB/spacer.gif" width="1" height="240"></td>
</tr>

de este codigo es la linea <style type="text/css">td img {display: block;}</style> la que me permite hacer que la visualizacion en hotmail se vea bien..

pero en gmail no me respeta esta:

ya probe poniendo padding bottom en cero..
poniendo y probando otros tipos de display..
omitiendo la linea que hace referencia a un archivo spacer.gif

en verdad ya no se que mas moverle.. agradeceria su fina atención y cualquier idea para una posible solución.

Saludos

carlospc · #2 (**permalink**) 01/06/2011, 17:26

Te cuento, hay un detalle con gmail, a tu tabla asignale tamaños absolutos, otro, trabaja sin saltos de linea ya que para gmail hacer:

Cita:

No es lo mismo que hacer:

Cita:

Suerte...

BuckInc · #3 (**permalink**) 02/06/2011, 17:47

Cita:

Iniciado por carlospc

Te cuento, hay un detalle con gmail, a tu tabla asignale tamaños absolutos, otro, trabaja sin saltos de linea ya que para gmail hacer:

No es lo mismo que hacer:

Suerte...

Hice la prueba con el codigo donde entiendo que todo lo tenia que haber puesto corrido.. es decir sin saltos de linea como me comentas.. sin embargo sigue apareciendo esa famosa linea blanca que no termina de convencerme puesto que me distociona la imagen.

Ahora bien lo curioso es que si hago un corte vertical a la imagen esta linea que te menciono no aparece sin embargo si hacemos el corte horizontal si aparece..

curioso.. agradezco tu respuesta y quedo en espera se surge alguna otra idea o posible solución..

Gracias.!

carlospc · #4 (**permalink**) 02/06/2011, 22:18

probaste a poner de grosor de borde 0?

Tedel · #5 (**permalink**) 02/06/2011, 22:20

En general, no debes usar CSS para un email HTML, porque GMail lo bloquea. Debes usar tablas simples y HTML 1 de preferencia (sí, esto incluye usar <font>).

Es decir, Gmail ignora por completo el style="display: inline-block" que hace que tu web se vea bien en otros correos-e. Debes ver la manera de construir la tabla 100% sin estilos.

Espero ayude.