-2

Hay alguna manera de hacer que el texto que esta dentro de un div ocupe el 100% de este y se vaya ajustando si el div cambia su tamaño? O solo queda usar @media ?

1

2 respuestas 2

0

Que tal para esto podrias utilizar vw unidad. Es significado de "Viewport Width" utilizando esto el texto sera del tamaño del navegador. Puedes testear utilizando este codigo.

<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<body>

<h1 style="font-size:10vw;">Texto Responsivo</h1>

<p style="font-size:5vw;">Cambia de tamaño la pantalla para ver el cambio de escala de tamaños.</p>

<p style="font-size:5vw;">Utiliza "vw" cuando cambies de tamaño el texto. 10vw configurara el tamaño a un 10% del "Viewport Width".</p>

<p>Viewport es el tamaño del navegador. 1vw = 1% del viewport width. Si el viewport es 50cm wide, 1vw es 0.5cm.</p>

</body>
</html>

Espero te ayude. Saludos.

0

puedes probar a hacer lo siguiente

div#contenedor-texto {
width=80%;
}

p {
width=100%;
}
<!DOCTYPE html>
<html>
<head>
<title>Texto 100%</title>
<meta charset="utf-8">
</head>
<body>
<div id="contenedor-texto">
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>
</div>
</body>
</html>

1
  • En CSS no se usa el símbolo de igual (=) para indicar el valor de la propiedad, sino los dos puntos (:).
    – Alvaro Montoro
    el 13 jun. 2019 a las 4:16

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.