Foros del Web » Creando para Internet » CSS »

div se pega a la derecha

Estas en el tema de div se pega a la derecha en el foro de CSS en Foros del Web. Hola a todos, llevo mucho tiempo en este foro y siempre me ha solucionado muchos problemas, pero ahora no encuentro la solución por ningun sitio ...
  #1 (permalink)  
Antiguo 09/05/2009, 10:28
 
Fecha de Ingreso: mayo-2009
Mensajes: 3
Antigüedad: 8 años, 7 meses
Puntos: 0
div se pega a la derecha

Hola a todos, llevo mucho tiempo en este foro y siempre me ha solucionado muchos problemas, pero ahora no encuentro la solución por ningun sitio y necesito vuestra ayuda.

Tengo una página que cuando la veo con Firefox o Chrome sale perfecta, todo bien centradito y esas cosas, la estructura son 3 div dentro de div principal ("wrapper")
este wrapper en Firefox & Chrome & IE8 sale centrado pero no en los IE antiguos. (y la persona para la que estoy creando la página es anti-tecnologia y no quiere actualizar su navegador "porque no se aclara")

En fin, el div en cuestion (wrapper) en IE6 o IE7 sale pegado a la derecha y no se porque. (Bueno tengo una ligera pero no se si es por eso ni como solucionarlo) No se si será por la propiedad position:absolute de los div contenidos en el div wrapper

La página es uv.es/calfaro

Copio el CSS por si aca:

Código:
#wrapper{
	margin-top: 70px;
	margin-left: auto;
	margin-right: auto;
	width: 940px;
	text-align: center;
}

#izquierda{
	float: left;
	border: 1px solid #666;
	width: 230px;
	height: 812px;
	position: absolute;
	_position: absolute;
}

#centro{
	float: left;
	margin-left: 242px;
	position: absolute;
	_position: absolute;
	width: 470px;
}

#centro .up{
	border: 1px solid #666;
	height: 260px;
}

#centro .down{
	margin-top: 12px;
	border: 1px solid #666;
	height: 540px;
}

#derecha{
	margin-left: 722px;
	float: left;
	border: 1px solid #666;
	width: 230px;
	height: 812px;
	position: absolute;
	_position: absolute;
}

#plantilla{
	width: 800px;
	margin-left: auto;
	margin-right: auto;
}

#plantilla .arriba{
	border: 1px solid #666;
	height: 150px;
}
#plantilla .abajo{
	border: 1px solid #666;
	margin-top: 12px;
	padding: 20px 20px 0px;
}
Muchas gracias y un saludo
  #2 (permalink)  
Antiguo 09/05/2009, 13:51
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: div se pega a la derecha

no son necesarias las posiciones absolutas y menos los hacks que declaras siendo que son los mismo el original y el hack, pero bueno, pienso que sería de esta manera:

Código html:
Ver original
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  4. <title>Documento sin t&iacute;tulo</title>
  5. <style type="text/css">
  6. #wrapper{
  7.     margin:70px auto 0 auto;
  8.     width: 940px;
  9. }
  10.  
  11. #izquierda{
  12.     float: left;
  13.     border: 1px solid #666;
  14.     width: 230px;
  15.     height: 812px;
  16. }
  17.  
  18. #centro{
  19.     float: left;
  20.     width: 470px;
  21. }
  22.  
  23. #centro .up{
  24.     border: 1px solid #666;
  25.     height: 260px;
  26. }
  27.  
  28. #centro .down{
  29.     margin-top: 12px;
  30.     border: 1px solid #666;
  31.     height: 540px;
  32. }
  33.  
  34. #derecha{
  35.     float: left;
  36.     border: 1px solid #666;
  37.     width: 230px;
  38.     height: 812px;
  39. }
  40.  
  41. #plantilla{
  42.     width: 800px;
  43.     margin-left: auto;
  44.     margin-right: auto;
  45. }
  46.  
  47. #plantilla .arriba{
  48.     border: 1px solid #666;
  49.     height: 150px;
  50. }
  51. #plantilla .abajo{
  52.     border: 1px solid #666;
  53.     margin-top: 12px;
  54.     padding: 20px 20px 0px;
  55. }
  56. </head>
  57.  
  58. <div id="wrapper">
  59.     <div id="izquierda">asdfasdf</div>
  60.     <div id="centro">fasdfasdf</div>
  61.     <div id="derecha">asdasdf</div>
  62. </div>
  63. </body>
  64. </html>
__________________
WFC
codigo82
  #3 (permalink)  
Antiguo 09/05/2009, 14:30
 
Fecha de Ingreso: mayo-2009
Mensajes: 3
Antigüedad: 8 años, 7 meses
Puntos: 0
Respuesta: div se pega a la derecha

Muchisimas gracias!!! La verdad es que los hacks los puse porque estaba desesperado y me puse a probar cosas que veia por internet y se me olvido quitarlos cuando copie el código.

Acabo de entender que es lo que pasaba, xD. Cuando quitaba el position:absolute me dejaba el margen izquierdo respecto del útlimo div y como sobrepasaba las dimensiones del div wrapper pasaba a la fila de abajo y eso era lo que me llevaba de cabeza.

Vuelvo a repetir, muchisimas gracias por todo.

Un saludo!!
  #4 (permalink)  
Antiguo 09/05/2009, 14:37
Avatar de willyfc  
Fecha de Ingreso: octubre-2008
Ubicación: Santa Cruz - Bolivia
Mensajes: 662
Antigüedad: 9 años, 2 meses
Puntos: 40
Respuesta: div se pega a la derecha

no es nada, cuando quieras.
__________________
WFC
codigo82
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 13:34.