Foros del Web » Creando para Internet » CSS »

problema con hoja

Estas en el tema de problema con hoja en el foro de CSS en Foros del Web. Hola, cree una hoja que consiste en un div con background blanco, y quiero que llegue hasta el final de la web, por lo que ...
  #1 (permalink)  
Antiguo 04/06/2011, 20:14
 
Fecha de Ingreso: febrero-2011
Mensajes: 124
Antigüedad: 6 años, 3 meses
Puntos: 4
problema con hoja

Hola, cree una hoja que consiste en un div con background blanco, y quiero que llegue hasta el final de la web, por lo que le he añadido las siguientes propiedades:
.contenedor{
background-color: #fff;
width: 920px;
margin:auto;
height:auto;
position:relative;
top:-20px;
}
pero la hoja llega hasta mas abajo del footer, revise las areas de los divs y todo esta en orden, el contenedor me sale que sigue para abajo solo... he estado horas tratando de encontrar el error y nada!, haber si pueden ayudarme...
la web:
http://test.elementobmx.com/nueva/
  #2 (permalink)  
Antiguo 05/06/2011, 05:59
Avatar de MarioAraque
Colaborador
 
Fecha de Ingreso: octubre-2009
Ubicación: Valencia
Mensajes: 1.398
Antigüedad: 7 años, 7 meses
Puntos: 265
Respuesta: problema con hoja

El problema esta en que vos estructuras la web con divs, pero para la alineacion, en vez de usar float, usas position:relative.

El div "contenedor_contenido" (ese es el nombre que le pusiste de class), tiene un top:-800, lo que logras es que se mueva para arriba 800 pixeles, pero no lo moves de su posicion dentro del html, es decir, logras un efecto visual de movimiento, pero no lo moves del orden de aparicion dentro del html.
Al div de la izquierda (contenedor_menuproductos) le pusiste un height:1000px, que si lo quitas tambien subis la web...pero seguis teniendo el mismo problema con el position:relative.

La forma ideal de hacerlo, a mi gusto (porque supongo que cada uno tiene su estilo), es usar divs pero hacerlos flotar para ubicarlos, no es dificil, pero supone que tengas que cambiar muchisimo de tu hoja de estilo .... pero creeme que va a quedar mucho mejor y con menos cantidad de lineas.

Saludos.
  #3 (permalink)  
Antiguo 05/06/2011, 11:54
 
Fecha de Ingreso: febrero-2011
Mensajes: 124
Antigüedad: 6 años, 3 meses
Puntos: 4
Respuesta: problema con hoja

pero usando float, no se le dice exactamente donde ubicarse, puede correrse 5 pixeles.. y eso no me sirve... pero tu dices ponerle el float dentro del position relative?, o borrarle el positicionrelative y ponerle un float?
  #4 (permalink)  
Antiguo 05/06/2011, 13:41
Avatar de MarioAraque
Colaborador
 
Fecha de Ingreso: octubre-2009
Ubicación: Valencia
Mensajes: 1.398
Antigüedad: 7 años, 7 meses
Puntos: 265
Respuesta: problema con hoja

Borrar cualquier position relative y hacerlo todo con divs flotantes.
Ese top -800px te pone el div en el sitio que vos quisieras, pero esos 800px que se movio para arriba no los podes ocultar de ningun modo! Bueno si, poniendo otro elemento con position relative -800px ... pero eso ya es cutrear el codigo.
Con float si podes ubicar los elementos donde vos quieras. Tu div "contenedor_contenido" mide 680px. Si dentro declaras otros dos divs, en donde las sumas de sus widths sea 690px (contando bordes, margins y paddings), y los flotas a los dos a la izquierda, tenes el efecto que vos queres ... sin embargo tenes que tocar todo el codigo para poder llegar a eso. Es tu eleccion...

Saludos.
  #5 (permalink)  
Antiguo 05/06/2011, 13:56
 
Fecha de Ingreso: febrero-2011
Mensajes: 124
Antigüedad: 6 años, 3 meses
Puntos: 4
Respuesta: problema con hoja

Gracias! me pondre a investigar sobre la funcion...
prefiero tener un codigo mas bien fluido y limpio asique haré lo que dices..

Etiquetas: hoja
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 12:55.