#1 [CSS] Relative positioning - Firefox OK, IE Mal!
Hola, como andan? Les cuento mi problema a ver si pueden ayudarme a solucionarlo. Centré un div con una imagen de fondo y dentro coloqué dos divs más (uno con Adsense y otro con texto, que quiero que funcione con scroll). El tema es que en Firefox se ve como quiero que se vea, pero en Internet Explorer (7, el resto supongo que también) los dos divs que están alineados relativamente se ven unos cuantos píxeles más a la derecha que de donde deberían estar.
Como seguramente no entendieron mucho qué es lo que me pasó, les dejo el html con el css incluído:
Demo en vivo: Simpsonizados.com
Gracias de antemano por la ayuda que me puedan dar, ya que quería hacerlo con css y sin tablas
Saludos!
Edit: SOLUCIONADO. Lo que pasaba era que al no ponerle text-align: left al contenedor, ie empezaba a mover relativamente desde el centro del div contenedor y por eso se descentraba todo... pero bue, ya está.
Como seguramente no entendieron mucho qué es lo que me pasó, les dejo el html con el css incluído:
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=utf-8" />
<title>Simpsonizados.com - Capítulos de Los Simpsons - Episodios completos On line y GRATIS</title>
<link rel="shortcut icon" href="http://www.simpsonizados.com/images/favicon.ico">
<style>
body{
text-align: center;
background-color:#fede00;
font-family:"Trebuchet MS", Tahoma, Arial, Helvetica, sans-serif;
line-height:1.5;
font-size:11px;
}
#index{
width: 686px;
height: 400px;
margin: 0 auto;
position: relative;
top:20px;
background-image: url(fondosimp.jpg);
background-repeat: no-repeat;
}
#entrar{
position:relative;
top: 350px;
left: -278px;
}
#ads{
/*width: 234px;
height: 60px;*/
position:relative;
top: 290px;
left: 385px;
}
#box{
width: 300px;
height: 150px;
position:relative;
top: 60px;
left: 350px;
overflow: auto;
text-align:justify;
}
#box p{
padding-right: 10px;
}
.text{
font-size:12px;
}
</style>
</head>
<body>
<div id="index"><!--<div id="entrar"><a href="http://www.simpsonizados.com/index.php"><img src="entrar.gif" border="0" /></a></div>--><div id="ads"><script type="text/javascript"><!--
google_ad_client = "pub-1481153289709922";
/* Simp index */
google_ad_slot = "4238405141";
google_ad_width = 234;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></div><div id="box"><p><strong>Simpsonizados.com no almacena, ni ripea, ni copia, ni sube los contenidos a internet.</strong>
Nuestro buscador simplemente rescata, clasifica y finalmente ENLAZA,
los videos del portal Megavideo cuyo contenido pueda ser de interés para los visitantes de esta web.</p><p>-
Todas las marcas mencionadas y logos están registrados por sus
legítimos propietarios y solamente se emplean como referencia a las
mismas y con un fin de cita o comentario.</p><p>- En <strong>Simpsonizados.com</strong> no reproducimos,
plagiamos, distribuimos, alojamos, subimos ni comunicamos públicamente material con derechos de autor. Los
enlaces que muestra nuestro buscador han sido encontrados en Megavideos de
Divx.com dando por hecho que tanto los usuarios que los han subido como
los servidores públicos que los alojan tienen los contratos pertinentes
para garantizar la legalidad de su visionado. </p><p>- No nos hacemos responsables del uso indebido de nuestro servicio.</p><p>-
En ningún caso o circunstancia se podrá responsabilizar directamente o
indirectamente al propietario ni a los colaboradores del ilícito uso de
la información contenida en Simpsonizados.com. Así mismo tampoco se nos podrá
responsabilizar directamente o indirectamente del uso incorrecto o mala
interpretación que se haga de la información y servicios incluidos.
Igualmente quedará fuera de nuestra responsabilidad el material al que
pueda acceder desde nuestros enlaces. </p><p>El acceso a <strong>Simpsonizados.com</strong> es de
carácter privado y no público, exige la aceptación del presente aviso.
En esta web se podrá acceder a contenidos publicados y alojados en Megavideo. El único material que existe en la web procede de enlaces
públicos a dicho contenido, facilitando únicamente la copia privada.
Los propietarios de Megavideo son plenamente responsables de los
contenidos que publiquen y de los archivos que alojen.</p> <p>Por todo ello, <strong>Simpsonizados.com</strong>
ni aprueba, ni hace suyos los productos, servicios, contenidos,
información, datos, opiniones archivos y cualquier clase de material
existente en Megavideo y no controla ni se hace responsable de la calidad,
licitud, fiabilidad y utilidad de la información, contenidos y
servicios existentes en Megavideo. Para visualizar o acceder a la descarga
de cualquier video, lea previamente los terminos de uso de Megavideo, que es de donde se descargará el mismo.
</p><p><strong>En caso de encontrar material que infrija la ley o los
derechos de autor pongase en contacto con Megavideo para su retirada
inmediata a la siguiente dirección: </strong><a href="mailto:" style="color: rgb(241, 103, 11);">dmca@megavideo.com</a></p>
</div>
</div>
<p class="text">Para ver correctamente los videos <b>ES INDISPENSABLE USAR FIREFOX.</b> Descargalo <a href="http://www.firefoxnet.com.ar" target="_blank">aquí</a>. Optimizada para 1024*768.<bR /><a href="http://www.simpsonizados.com/index.php">Entrar</a></p>
</body>
</html>
Gracias de antemano por la ayuda que me puedan dar, ya que quería hacerlo con css y sin tablas
Saludos!
Edit: SOLUCIONADO. Lo que pasaba era que al no ponerle text-align: left al contenedor, ie empezaba a mover relativamente desde el centro del div contenedor y por eso se descentraba todo... pero bue, ya está.
Editado por caballeroq - 27.06.2008 08:00 hs. | Motivo: Solucionado
0
