#hola amigos, alguno puede ayudarme con

1 messages · Page 1 of 1 (latest)

wooden patrol
#

en el primer gif muestro las propiedades de los elementos, el del borde verde es el div, y el de relleno morado es el párrafo

#

en el segundo se ve como espero que se comporte el párrafo, como pueden ver se encoje su ancho hasta el mínimo configurado, sin importar que el div se haga mas pequeño, pero como ya les mencione, necesito que el div también tenga un comportamiento similar, quiero que no se haga mas pequeño que lo que le permite su contenido, cuando el p pare de encogerse que lo haga también el div, de no ser así se vera extraño, ya que donde necesito usarlo también necesito que se vea el borde y el padding del div, que en este caso para facilidad de verlo lo pongo verde, así que esto de que se siga encogiendo no me sirve, además de que el elemento deja de estar centrado tan pronto el div puede ser mas pequeño que todo su contenido.

#

para lograr lo anterior se supone que el div tendría que tener una propiedad que le indique que su ancho mínimo sea el que le determine su contenido, pero como se ve en este gif, con cualquiera de las propiedades no lo logro, tan pronto le pongo alguna el p toma el ancho del texto contenido, y no el del mínimo establecido en 25px.

#

por ende al cambiar el tamaño del div como se ve en este ultimo gif, su ancho mínimo lo determina la longitud del texto contenida en el p y no su ancho mínimo.

#

he probado de todas las manera que se me han ocurrido, combinando todas los posibles valores de width tanto en el div como en el párrafo, también recurriendo a las propiedades de flex, flex-basis, flex-grow, flex-shrink, pero con nada logro el comportamiento esperado.

ojala alguno pueda ayudarme con esto, de antemano muchísimas gracias.

sour owl
#

Por favor comparte el código en codepen para revisarlo

wooden patrol
#

vale, aunque no es mas que lo que se ve ahi. pero dale, ya lo comparto

sour owl
#

Le pusiste un min-width al contenedor pero en unidades absolutas? px, por ejemplo. Porque entiendo que tu idea es que no puedas reducirlo mas de cierto tamaño específico

wooden patrol
#

pero es que el min-width lo lleva el parrafo, el morado, y el contenedor div verde su minimo es lo que su contenido le permita

#

y el min-width del parrafo es de 25px como lo muestro en el primer gif