Foros del Web » Creando para Internet » CSS »

Cambiar de posición DIvs

Estas en el tema de Cambiar de posición DIvs en el foro de CSS en Foros del Web. Estimados: He intentado cambiar de posición unos divs. Me explicó tengo en código lo siguiente: Código: <div class="div_01"></div> <div class="div_02"></div> Lo que quiero lograr es ...
  #1 (permalink)  
Antiguo 22/12/2008, 16:58
 
Fecha de Ingreso: febrero-2008
Ubicación: Santiago - Chile
Mensajes: 42
Antigüedad: 9 años, 9 meses
Puntos: 0
Cambiar de posición DIvs

Estimados:

He intentado cambiar de posición unos divs. Me explicó tengo en código lo siguiente:

Código:
<div class="div_01"></div>
<div class="div_02"></div>
Lo que quiero lograr es que por CSS el "div_02" quede encima del "div_01". Si alguien no entendio mucho mi idea, pueden verlo en imagen directamente http://es.tinypic.com/view.php?pic=2d9a1s0&s=5

Muchas gracias
  #2 (permalink)  
Antiguo 22/12/2008, 17:21
Avatar de emiliodeg  
Fecha de Ingreso: septiembre-2005
Ubicación: Córdoba
Mensajes: 1.830
Antigüedad: 12 años, 3 meses
Puntos: 54
Respuesta: Cambiar de posición DIvs

div {float:right}
__________________
Degiovanni Emilio
developtus.com
  #3 (permalink)  
Antiguo 22/12/2008, 17:48
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Cambiar de posición DIvs

HTML:
Cita:
<div class="div_01"></div>
<div class="div_02"></div>
CSS:
Cita:
.div_01, .div_02 {position: relative;
height: 24px;
}
.div_01 {top: 24px;}
.div_02 {top: -24px;}
Por ejemplo.
__________________
Visita mi nueva web idplus.org
  #4 (permalink)  
Antiguo 22/12/2008, 17:48
 
Fecha de Ingreso: febrero-2008
Ubicación: Santiago - Chile
Mensajes: 42
Antigüedad: 9 años, 9 meses
Puntos: 0
Respuesta: Cambiar de posición DIvs

Pero no me funciona así, si utilizo de esa forma el "div_02" me queda al costado izquierdo del día "div_01"

Ejemplo

_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
| div_02 | div_01 |
_ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _ _
  #5 (permalink)  
Antiguo 22/12/2008, 17:50
 
Fecha de Ingreso: febrero-2008
Ubicación: Santiago - Chile
Mensajes: 42
Antigüedad: 9 años, 9 meses
Puntos: 0
Respuesta: Cambiar de posición DIvs

Mikmoro muchas gracias por tu ayuda, pero el problema es que el "div_01" puede tener altura relativa de acuerdo a la cantidad de contenido que posea, entonces la forma que me mencionas no me serviría en ese caso.
  #6 (permalink)  
Antiguo 22/12/2008, 17:55
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Cambiar de posición DIvs

Cita:
Iniciado por euforico Ver Mensaje
Mikmoro muchas gracias por tu ayuda, pero el problema es que el "div_01" puede tener altura relativa de acuerdo a la cantidad de contenido que posea, entonces la forma que me mencionas no me serviría en ese caso.
Ya, creo que deberías haberlo mencionado antes. De todas maneras, me parece que si la altura de ambas cajas es dinámica, mediante CSS va a ser bastante difícil que puedas permutar las posiciones. De momento no se me ocurre cómo. A ver a los demás.
__________________
Visita mi nueva web idplus.org
  #7 (permalink)  
Antiguo 22/12/2008, 18:09
 
Fecha de Ingreso: febrero-2008
Ubicación: Santiago - Chile
Mensajes: 42
Antigüedad: 9 años, 9 meses
Puntos: 0
Respuesta: Cambiar de posición DIvs

Cita:
Iniciado por Mikmoro Ver Mensaje
Ya, creo que deberías haberlo mencionado antes. De todas maneras, me parece que si la altura de ambas cajas es dinámica, mediante CSS va a ser bastante difícil que puedas permutar las posiciones. De momento no se me ocurre cómo. A ver a los demás.
Perdon, solamente el "div_02" tiene altura dinámica, el "div_01" tiene altura fija. Lamento no haberlo mencionado antes.
  #8 (permalink)  
Antiguo 22/12/2008, 18:26
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: Cambiar de posición DIvs

En ese caso se me ocurre una manera (un simple ejemplo):

Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title></title>
<style type="text/css">
#contenedor {position: relative;
padding-bottom: 22px;
}
.div_01, .div_02 {color: #fff;}
.div_01 {background-color: #00f;
position: absolute;
height: 22px;
width: 100%;
bottom: 0;
}
.div_02 {background-color: #f0f;}
</style>
</head>
<body>
<div id="contenedor">
<div class="div_01">Bloque 1</div>
<div class="div_02">Bloque 2</div>
</div>
</body>
</html>
__________________
Visita mi nueva web idplus.org
  #9 (permalink)  
Antiguo 22/12/2008, 19:30
 
Fecha de Ingreso: febrero-2008
Ubicación: Santiago - Chile
Mensajes: 42
Antigüedad: 9 años, 9 meses
Puntos: 0
Respuesta: Cambiar de posición DIvs

Mikmoro, muchisimas gracias. Finalmente con lo que me mencionaste pude hacer el objetivo que quería con los divs.
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 20:51.