Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Fala pessoal, seguinte, eu coloquei uma palavra dentro dessa div, quando eu diminuo a resolução da tela a imagem diminui conforme a pagina, mas a letra não, como faço para letra diminuir junto? abraços
<div id="aniversarios" style="margin-left:2%; margin-top:1%; width:15%; height:15%; position:absolute;">
<span style="position:absolute; width:100%; margin-top:3%;" class="texto_verde">Aniversariantes</span>
<img src="img/teste_fundo_aniversarios.png" width="100%" height="100%" />
</div>Existe alguma solução com css puro?
isso que eu queria, só só com css daria para fazer.
já tentou definir o font-syze em porcentagem(100% = 12px) ou EM's?
mas, tenha em mente que
1em = 12pt = 16px = 100%
teoricamente '%' é relativa a resolução, mas honestamente não vi muita relatividade não, se você copiar um texto de um site definido como 100% 'font-family:Arial; font-size:100%;' em uma resolução de 800x600 e colar no word, vais ter uma fonte aria de 11pt(e não 12 como a tabela cima), e se você fizer a mesma coisa em uma resolução de 2048x1536 vai dar a mesma coisa.
você poderia usar as media queries do css3 'min-width, width e device-width'
ex. <link rel="stylesheet" href="iphone.css" media="screen and (max-width: 320px)">
ou direto no css
@media screen and (min-width:800px) { font-size:12pt; }
@media screen and (min-width:2048px) { font-size:16pt; }
isso sim funfa no ff do 7 pra cima e no IE(ca)9 e no chrome do 12 em diante se eu num me engano, mas(sempre tem um MAISS), o browser tem q interpretar 1º, ou seja, F5 no navegador.
na minha opinião? javascript ainda é a melhor solução!
pois roda no IE6, FF à lenha(foi daí q botaram fogo no rabo da raposa), chrome o lanche meniiiiiino, hehehe!
>
teoricamente '%' é relativa a resolução,
no caso do font-size não. % é relativo ao valor declarado em px anteriormente para outro font-size ancestral, e não relativo a resolução.
Olha, tem uma solução com CSS 3: media queries
Você pode diminuir a fonte baseado em certas resoluções, largura e etc. Não sei se é o seu caso, mas talvez possa ajudar:
Você vai precisar de algum JavaScript para cuidar disso pra você.
Dá uma olhada no FitText e vê se ele faz o que você quer:
http://fittextjs.com/