Foros del Web » Creando para Internet » CSS »

Divs Horizontales en IExplorer... la misma historia de siempre.. Firefox Vs IE

Estas en el tema de Divs Horizontales en IExplorer... la misma historia de siempre.. Firefox Vs IE en el foro de CSS en Foros del Web. Hola! Les cuento mi inconveniente, quizas puedan ayudarme. Estoy maquetando una pagina, y sucede el mismo problema de siempre... en FIREFOX se ve hermosa, y ...
  #1 (permalink)  
Antiguo 09/07/2008, 13:09
 
Fecha de Ingreso: octubre-2003
Mensajes: 11
Antigüedad: 20 años, 5 meses
Puntos: 0
Divs Horizontales en IExplorer... la misma historia de siempre.. Firefox Vs IE

Hola!
Les cuento mi inconveniente, quizas puedan ayudarme.

Estoy maquetando una pagina, y sucede el mismo problema de siempre... en FIREFOX se ve hermosa, y en Internet Explorerrrrr surgen inconvenientes.

La cuestion es esta:
Tengo un Pie de pagina armado con un gran rectangulo DIV, ancho y alto fijo. Dentro de este desparramados puse otros DIVS, unos cubos... como para armar un menu.
La cuestion es que en Firefox, no tengo problema, pero en IE hace algo raro, por empezar me estira la pagina.... y la estira porque noto, que si selecciono todos los elementos de la pagina una vez publicada..... los cubos estos que arme dentro del PIE se "duplican"....

Veanlo uds:

Codigo CSS:
Código:
#Pie{
	position:relative;
	z-index:3;
	width:1024px;
	height:257px;
	background-image:url(img/pie.jpg);
	background-repeat:no-repeat;
}
#Pie-menu{
	position:relative;
	z-index:4;
	width:125px;
	height:125px;
	top:65px;
	left:25px;
	background-color:#09D80E;
}
#Pie-menu2{
	position:relative;
	z-index:4;
	width:125px;
	height:125px;
	top:-100px;
	left:175px;
	background-color:#E50083;
}
#Pie-menu3{
	position:relative;
	z-index:4;
	width:125px;
	height:125px;
	top:-185px;
	left:340px;
	background-color:#09D80E;
}
#Pie-menu4{
	position:relative;
	z-index:4;
	width:125px;
	height:125px;
	top:-350px;
	left:485px;
	background-color:#E50083;
}
#Pie-menu-txta {
	position:absolute;
	bottom:2px;
	right:2px;
	font-size:27px;
	text-align:right;
	color:#FFFFFF;
	font-family:"B";
	font-weight:bold;
	height: 122px;
	display:block;
	width: 121px;
	text-decoration:none;
	}
#Pie-menu-txtb {
	position:absolute;
	top:1px;
	right:2px;
	font-size:28px;
	text-align:right;
	color:#FFFFFF;
	font-family:"";
	font-weight:bold;
	width: 121px;
	height: 125px;
	display:block;
	text-decoration:none;
	}
#Pie-texto{
	position:relative;
	z-index:4;
	width:335px;
	height:150px;
	top:-445px;
	left:660px;
	background-color:#FFFFFF;
}
#Pie-texto-txta{
	position:absolute;
	top:10px;
	right:4px;
	font-size:37px;
	text-align:right;
	color:#E50083;
	font-family:"";
}
#Pie-texto-txtb{
	position:absolute;
	top:55px;
	right:3px;
	font-size:19px;
	text-align:right;
	color:#E50083;
	font-family:"B";
	width: 325px;
}

Codigo HTML:
Código:
<div id="Pie">
<div id="Pie-menu"><a href="/servicios.html"><div id="Pie-menu-txta"><br />
  >><br />
  servicios</div></a>
</div>
<div id="Pie-menu2"><a href="http://www.flikr.com"><div id="Pie-menu-txtb">>><br />
  mi Flikr</div></a>
</div>
<div id="Pie-menu3"><a href="/contacto.html"><div id="Pie-menu-txta"><br />
  >><br />
  contacto</div></a>
</div>
<div id="Pie-menu4"><div id="Pie-menu-txtb">>><br />
  +DG</div>
</div>

<div id="Pie-texto"><div id="Pie-texto-txta">web porfolio</div><div id="Pie-texto-txtb">
  <p>>&gt; (ctrl+N) Espacio de diseño grafico<br />
  &gt;&gt; comunicacion visual y virtual</p>
</div>
</div>
La solucion, para mi debe estar, en cambiar la forma en que puse esos cubos... sucede que mientras los hacia... el 1ero lo alineaba normal con Top y Left... al siguente ya le tenia que dar atributos con valores negativos, ej Top: -100... y al segundo Top: -250... y asi...


Si quieren verlo ONLINE, para hacer esto de COPIAR.... hagan esto.... vallan al fondo de la pagina y seleccionen con el mouse... van a ver lo que les digo de los DIVS "duplicados"....

Agradeceria una ayuda!
Saludos!

Última edición por delakroketa; 14/12/2008 a las 16:35 Razón: Por razones de CopyRight no se puede mostrar la URL
  #2 (permalink)  
Antiguo 09/07/2008, 14:30
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 6 meses
Puntos: 280
Respuesta: Divs Horizontales en IExplorer... la misma historia de siempre.. Firefox V

No sé si tendrá que ver con el problema, pero tienes varios ID repetidos. Recuerda que el ID es un identificador único que debe ser usado una sola vez por página.

Mikel.
  #3 (permalink)  
Antiguo 09/07/2008, 14:40
 
Fecha de Ingreso: octubre-2003
Mensajes: 11
Antigüedad: 20 años, 5 meses
Puntos: 0
Respuesta: Divs Horizontales en IExplorer... la misma historia de siempre.. Firefox V

Mmmmm suena bastante logico... justamente estos "cuadros" que meti dentro del Pie de pagina se repiten....

No veo mis ID repetidos, justamente a cada uno le puse un nombre diferete...
Como se te ocurre que podria modificarlo?

Saludos ! =)
  #4 (permalink)  
Antiguo 09/07/2008, 14:48
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 17 años, 6 meses
Puntos: 280
Respuesta: Divs Horizontales en IExplorer... la misma historia de siempre.. Firefox V

Mira:

Cita:
<div id="Pie-menu" onmouseover="cursor='hand'"><a href="http://ctrln.net63.net/servicios.html"><div id="Pie-menu-txta"><br />

>><br />
servicios</div></a>
</div>
<div id="Pie-menu2"><a href="http://www.flikr.com"><div id="Pie-menu-txtb">>><br />
mi Flikr</div></a>
</div>
<div id="Pie-menu3"><a href="http://ctrln.net63.net/contacto.html"><div id="Pie-menu-txta"><br />
>><br />

contacto</div></a>
</div>
<div id="Pie-menu4"><div id="Pie-menu-txtb">>><br />
+DG</div>
</div>

<div id="Pie-texto"><div id="Pie-texto-txta">web porfolio</div><div id="Pie-texto-txtb">
Esos están repetidos, y hay alguno má.

Mikel.
  #5 (permalink)  
Antiguo 09/07/2008, 22:58
 
Fecha de Ingreso: octubre-2003
Mensajes: 11
Antigüedad: 20 años, 5 meses
Puntos: 0
Respuesta: Divs Horizontales en IExplorer... la misma historia de siempre.. Firefox V

Mikmoro!
Solucionado!

Ahora entiendo lo que me comentabas, asi que por las dudas cambie los nombres...

Y l que hice tambien, es pasar de position:relative a absolute los divs... y asi quedaron bien...

Lo unico extraño ahora es que la barra de dezplazamiento horizontal... pero... encontre esto: <body scroll="no"> .... y listo! ajjaja

Gracias por todo!
Saludosss!
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 19:48.