¿Hay alguna manera de hacerlo con solo CSS y sin secuencias de comandos? Tengo un div con un min-width, y dentro de él hay un div interno absolutamente posicionado con contenido generado dinámicamente de ancho variable. Algunas veces el contenido se extiende más allá del div que contiene, pero como está absolutamente posicionado, no extenderá el div que lo contiene. ¿Cómo lo hago para estirar el div que contiene? GraciasEstirar un div para que se ajuste al contenido absolutamente posicionado
Respuesta
Intente hacer referencia a este JSfiddle que hice. http://jsfiddle.net/gA7mB/ Si lo leo bien, es básicamente lo que estás buscando.
HTML
<div class="container" >
<div class="relative" >
<div class="absolute" >
<h1>I am Content i can be as long as you wish. t is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).</h1>
</div>
</div>
CSS
.container{
width: 500px;
}
.relative{
position: relative;
background: #666;
min-width: 200px;
min-height: 200px;
}
.absolute{
position: absolute;
background: #999;
top: 20px; //not important, just to show absolute position
left: 20px; //not important, just to show absolute position
}
No funciona para mí: http://jsfiddle.net/gA7mB/117/ –
Esto funciona muy bien para mantener el ancho del niño, pero ¿hay alguna manera de hacer que la altura de los padres también abarque al niño? –
Si el elemento de contenido tiene position: absolute
, no es posible. Sin embargo, a veces puede evitar el posicionamiento absoluto y, sin embargo, obtener el resultado deseado mediante el uso de un elemento flotante. Ver this answer a very similar question para un ejemplo.
- 1. ¿Cómo centro el contenido absolutamente posicionado de ancho desconocido?
- 2. Expandir div para contener contenido completamente posicionado
- 3. Cambiar el tamaño de un div para que se ajuste al contenido con la altura máxima
- 4. ¿Cómo se reduce el contenido para que se ajuste a un div?
- 5. Obteniendo la imagen para estirar un div
- 6. CSS: No ajuste el contenido de div
- 7. cómo configurar la altura de los padres del elemento absolutamente posicionado para crecer/reducir encinta
- 8. Solo se desplaza dentro de un div, mientras que el sitio web se mantiene posicionado
- 9. jQuery: fadeout() no funciona en el elemento absolutamente posicionado cuando se carga a través de AJAX
- 10. div magnético: div fijado en el interior absoluta div posicionado
- 11. CSS - relativa posicionado div padre no se extiende a la altura div infantil absoluta
- 12. ¿Cómo hago para que un div HTML se ajuste a otro div?
- 13. ¿Cómo hacer un div dentro de un td para estirar?
- 14. Alineación vertical de un div posicionado en el interior de un div que contiene
- 15. cómo estirar div altura para llenar div padre - CSS
- 16. Estirar ul horizontal para ajustar el ancho de div
- 17. Cambiar el tamaño de la altura UIWebView para que se ajuste al contenido
- 18. ¿Cómo obtener un div para cambiar el tamaño de su altura para que se ajuste al contenedor?
- 19. Cómo evitar que un div y su contenido se impriman
- 20. Auto/mejor ajuste columnas JTable, pero estirar la última columna
- 21. Estirar imagen para llenar div, pero no sesgar
- 22. No debería "text-align: center;" aplicado a un elemento absolutamente posicionado, ¿no hacer nada con sus elementos secundarios?
- 23. ¿Cómo centrar un div completamente posicionado dentro de IE7?
- 24. Hacer texto envolvente dentro de un div totalmente posicionado
- 25. Cómo hacer que la información flotante de css pura (intervalo absolutamente posicionado) cambie el tamaño dinámicamente para acomodar el texto
- 26. ¿Cómo hacer que un div se expanda para adaptarse al espacio vertical disponible?
- 27. posición correcta un elemento que ya se ha dejado posicionado
- 28. ¿Cómo hago que el contenido de UIWebView se ajuste al tamaño de la pantalla del iPhone?
- 29. de desplazamiento y estirar el contenido de un expansor
- 30. ¿Necesitamos absolutamente un STS para SAML?
no, sin la secuencia de comandos AFAIK –
configure un ejemplo para que podamos trabajar con lo que tiene http://jsfiddle.net – Henesnarfel
La div completamente posicionada ya no está "adentro" del elemento primario. Por lo tanto, es imposible hacer esto con solo CSS. – Bazzz