Problema con position relative y absolute

[chichote]

Buenas amigos de FDW, tengo un problema con css, y como se que aca hay buenos css ninja, espero que alguno me pueda orientar.

Pues tengo un div con position relative, y dentro de el 2 div con position absolute y posicionado en diferentes extremos del div que tiene position relative.

Código:

<div style="position:relative">

     <div style="position:absolute">
          aca contenido
     </div>

     <div style="position:absolute">
          aca contenido
     </div>

</div>

<div>
     aca mas contenido
<div>

El problema es que el div que tiene el texto "aca mas contenido" se mete debajo del div con position relative.

Una cosa importante, agregando un height definido funciona bien, pero mi problema es que necesito que height sea auto porque lo estoy haciendo responsive


Alguna idea?


Saludos y desde ya muchas gracias.

[ArturoGallegos]

si estas tratando de hacer "responsive design" deberías considerar otras opciones para conseguir el resultado deseado, has de recordar que cuando usas postion:absolute o fixed los elementos se salen de su flujo normal y el elemento padre deja de tomar la altura conforme al contenido de estos.

Así que o se busca otra alternativa o se usa min-height o height para definir una altura aceptable, que permita la correcta visualización.

[chichote]

Iniciado por Ag666

Así que o se busca otra alternativa o se usa min-height o height para definir una altura aceptable, que permita la correcta visualización.

Si claro, de hecho ese es mi problema, min-height no me sirve porque de todos modos el div se mete detras. y con height el responsive me sigue funcionando, pero se ve muy feo.

[chichote]

Bueno, finalmente lo solucione no precisamente con css, lo hice con jquery. Dejo el codigo por si a alguien le sirve.

Código:

<div id="myCarousel-gal">
     <div class="content">
     </div>
</div>

Código:

$(window).load(function() {
     $("#myCarousel-gal").height($("#myCarousel-gal .content").height());
 });

Donde el div con class content esta con position absolute y es el que tiene el height mas grande. Lo que hago es simple, espero que la pagina se haya cargado y capturo el height de .content y se lo asigno a #myCarousel-gal


Saludos.