Ver Mensaje Individual
  #1 (permalink)  
Antiguo 25/10/2004, 09:00
dubafluye
 
Fecha de Ingreso: noviembre-2003
Mensajes: 50
Antigüedad: 20 años, 5 meses
Puntos: 0
Envio Boletin html con css en Outlook

Hola, estoy preparando un boletín en formato html que utiliza un fichero externo css pero resulta que al generar el boletín e insertarlo en el cuerpo del mensaje como Insertar>Texto de Archivo no consigo que coja los estilos, en cambio, visualizo dicha página en netscape o explorer y se ve correctamente, no sé donde estará el error. Os cuelto los códigos para ver si me podéis echar una mano, asimismo podéis ver el boletín generado en la dirección
http://www.metropolislibros.com/bole...oletin_php.htm

Aquel codigo html del boletin:
Código HTML:
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://www.metropolislibros.com/css/boletin.css"> 
<base target="_blank">
</head>
<body>
<div id="c">
<p class="nor">
Si no puedes ver correctamente este mensaje, accede a 
<a href="http://www.metropolislibros.com/boletinnovedades/novedades.html">
www.metropolislibros.com/boletinnovedades/novedades.html</a></p>
<div id="a">
<div id="sb">
<p class="ti"> Novedades de la Segunda quincena de Octubre</p>
</div>
<div id="f">Lunes 25 de Octubre de 2004</div>
</div>

<div id="p">


	<p class="nor">Buenas</p><table id ="b">
<colgroup>
<col id="d">
<col id="e">
</colgroup>
<tr><td colspan="5"><p class="z">LIBROS</p></td></tr><tr><td rowspan="4"><center><img src="http://www.metropolislibros.com/portadas/9920000000262.jpg" alt="NOSFERATU 46 -MARC RECHA AL DESNUDO-" height="120"></center></td><td colspan="4"><p class=v>NOSFERATU 46 -MARC RECHA AL DESNUDO-</p></td></tr><tr><td colspan="2">JUNIO 2004</td><td>66 Pag.</td><td>4.5 € </td></tr><tr><td colspan="4">Nuevo número de la prestigiosa revista NOSFERATU dedicada en esta ocasión a Marc Recha, en la cual varios expertos analizan su obra. Contiene una entrevista con el director y su filmografía incluyendo sus primeros cortometrajes.</td></tr><tr><td colspan="2"><a href=index2.php?case=f&id=9920000000262>Mas información</a></td><td colspan="2"><a class=boton href=compras/compra.php?&codigo=9920000000262>Compra</a></td></tr></table>
<div id="d">
<table id ="c">
<tr><td><p class="gr">OFERTAS</p></td></tr>
<tr><td><p class="g">OFERTA AJEDREZ STAR WARS EPISODIO II</p></td></tr><tr><td>Rebajamos el stock de este maravilloso ajedrez que reproduce...<a href=index2.php?case=o> Más</a></td></tr><tr><td><p class="g">VIDEO A MITAD DE PRECIO</p></td></tr><tr><td>Todo el stock de vídeo que tenemos en la librería lo hemos rebajado...<a href=index2.php?case=o> Más</a></td></tr><tr><td><p class="g">COMPRA 5 NOSFERATUS Y PAGA SOLO 2</p></td></tr><tr><td>Por la compra de tres números de la revista Nosferatu te regalamos...<a href=index2.php?case=o> Más</a></td></tr></table>
<table id ="c">
<tr><td><p class="z">VISITA</p></td></tr>
<tr width="80" height="60"><td>
          <a href=http://www.zinema.com><center><img src="http://www.metropolislibros.com/banners/zinema.jpg" width="80" height="51" alt="" border="0"></center></a></td></tr><tr width="80" height="60"><td>
          <a href=http://www.babadu.com><center><img src="http://www.metropolislibros.com/banners/badabu.gif" width="80" height="33" alt="" border="0"></center></a></td></tr></table>
<div id="op">
<p class="nor">Para darte de baja visita nuestra web <a href="http://www.metropolislibros.com/">AQUI</a> y activa la opción de baja junto con el e-mail al que te ha llegado este boletín.
</div>
</div>
</body>
</html> 
y el fichero boletin.css

Código:
/* estilos de tabla */

 thead {background: #A4A684;
	font: bold 10px;
	text-align:center;
	color:white;
	}
   
 td { 	font-size : 8pt;
	font-family:verdana,arial;
	text-align:justify;
	}
	
/* tabla con color */

 table#c,
 table#d {table-layout:fixed;
        background-color: #FDF5CE;
   	}
   	
 table#c {width:100%;text-align:center} 
 table#d {width:300px;text-align:justify;} 

/* tabla transparente*/

 table#b {table-layout:fixed;
	background-color: transparent;
	overflow:hidden;
	width:80%;
	text-align:justify;}
	

/* columnas de enlaces */

 col#d {width:100px;}
 col#e {width:250px;text-align: justify;}

/* tipos de letras */
 .ti {font:15pt verdana, arial;
	text-decoration: none;
	text-align: center;
	color: white;
	}
 .b {font:8pt verdana, arial; background-color: transparent;color: white;text-align: center;}	

 .z,
 .v,
 .ne,
 .n,
 .t,
 .gr  {font:bold 8pt verdana, arial;
	text-decoration: none;
	text-align: center;}
	
 .b {	background-color: transparent;color: white;}
 .z {	background-color: #0B5B9F;color: white;}
 .v {	background-color: #A4A684;color: white;}
 .ne { background-color: black;color: white;}
 .n {	background-color: #A4A684;color: black;}
 .t {	background-color: transparent;color: white;}
 .gr {	background-color: #CC6600;color: white;}

 .g,
 .nor {font: 8pt verdana,arial;
	text-decoration: none;
	text-align: center;
	}
 .g {	text-align: center;color:#CC6600;}
 .nor {text-align: justify;color:black;}


/* enlaces */

 a:link,
 a:visited,
 a:active {text-decoration:none;
	color:#0B5B9F;
	font: 12px arial;
	}

 a:hover {
	text-decoration:none;
	color:#F4A460;
	font: bold 12px arial;
	}


/* divisiones generales */

 div#c { position:absolute;
	left:50%;
	width:780px;
	margin-left:-390px;
	top:0px;
	}

 div#a {position: absolute;
	z-index: 100;	
	background-image: url(../images/logogranate.gif);
	width: 780px;
	height: 110px;
	top: 15px;
	} 

 div#p {position: relative;
	z-index: 100;
	width: 780px;
	top: 100px;	
	left: 0px;
	font: 10px arial;
	}

 div#d {position: absolute;
	width: 120px;
	left: 650px;
	top: 0px;
	z-index: 100;
	}

/* divisiones superiores */

 div#f,
 div#sb {background-color: transparent;
	position: absolute;
	z-index: 120;
	}

 div#f {	position: relative;
        left: 620px;
	top:85px;
	font: 9px arial;
	text-align: rigth;
	color: White;
	}
 div#sb {left:200px;top:25px;}


 div#co,
 div#op {background-color:transparent;
	position: relative;
	text-align: center;
        left:10px;
	z-index:80;
	width: 90px;
	height: 20px;
	font: 8pt arial;
	border-style:groove;
	}
	
 div#co {top:40px;}                                       
 div#op {top:30px;}

 .cajon {padding: 0.1em;
	font: 10px "Verdana, Tahoma, Arial";
	margin-left: 0.1em;
	background-color: #FDF5CE;
	text-align: left;
	}

 .boton {border: 1px solid #000000;
	font: normal 9px verdana, arial, "trebuchet MS", helvetica, sans-serif;
	background: #FDF5CE;
	color: #000000;
	padding: 0px;
	}
A ver si me echais una mano. Saludos