Como ajustar tamanho do texto dentro de um elemento ao dar zoom na tel

[DiogoJefferson 0]

Olá,

 

Tenho um div com dimensões 50% x 50% centralizada na página. Ao dar um zoom na tela (até certo ponto), o texto ultrapassa a área da div. Gostaria de saber como fazer para corrigir esse problema.

 

Obrigado ;)

[André do Vale 76]

Você está trabalhando um container com medidas proporcionais. Logo, se quiser que o conteúdo (imagens e/ou texto) acompanhem o redimensionamento geral, deverá fazê-los também proporcionais.

 

Poste um exemplo de como você fez (e como está no momento) para que possamos ajudar melhor.

[DiogoJefferson 0]

Olá André, tudo bom?

 

Veja só um exemplo simples:

 

HTML:

 

<div id="teste">

<p>Lorem Ipsum é simplesmente uma simulação de texto da indústria tipográfica e de impressos, e vem sendo utilizado desde o século XVI, quando um impressor desconhecido pegou uma bandeja de tipos e os embaralhou para fazer um livro de modelos de tipos. Lorem Ipsum sobreviveu não só a cinco séculos, como também ao salto para a editoração eletrônica, permanecendo essencialmente inalterado. Se popularizou na década de 60, quando a Letraset lançou decalques contendo passagens de Lorem Ipsum, e mais recentemente quando passou a ser integrado a softwares de editoração eletrônica como Aldus PageMaker.</p>

</div>

CSS:

#teste{

width: 50%;

height: 50%;

position: relative;

top: 25%;

left: 25%;

background-color: black;

}

p{

text-align: center;

text-align: justify;

color: #FFF;

}

Nesse exemplo, aumentando o zoom na tela o texto ultrapassa a div. Como tenho a div em porcentagem, o tamanho do texto deve ser em porcentagem também? Como resolvo isso?