Texto ilimitado em área limitada

[vdepizzol 0]

Olá,

 

Como faço para mostrar um texto ilimitado em uma área limitada, como no Gmail? (Na caixa de entrada, ao lado do assunto da mensagem, aparece o início do texto da mensagem. E se esse texto for maior, ele corta (screenshot))

 

O Gmail utiliza o seguinte html para fazer aquele resultado:

 

<td>orkut - conferma dell'email<span class='p'>- Ciao Vinicius, Per verificare il tuo indirizzo email con orkut, fai clic sul seguente link: http …</span></td>

Mas não sei qual css ele usa, pois não o encontrei...

 

Alguém sabe como se faz isso? http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

[hargon 64]

hummm até onde eu sei, isso é feito na hora de exibir, através da linguagem (ASPX, ASP, PHP, JSP, CGI... sei lá... qualquer uma dessas) que está buscando os e-mails na caixa.

 

Acho que em CSS não é possível fazer isso. No máximo, você pode conseguir utilizando Javascript, mas não faço nem idéia de como fazer isso e do trabalho que daria utilizando Javascript. Já as demais linguagens, você pode buscar nos fóruns daqui mesmo, procura por "quebra de texto" ou "função 3 pontinhos".

[vdepizzol 0]

Acontece que o Gmail não usa nenhum "três pontinhos", o texto vai até onde a tela for (layout líquido) e, se não der, ele corta.

 

O efeito deve ser feito com css mesmo. Veja o código html:

 

<td>Assunto<span class='p'>	Início da mensagem (se for maior que a tela, corta), mensagem mensagem mensagem mensagem mensagem mensagem mensagem</span></td>

[hargon 64]

hehe o meu usa... todas os assuntos que não são exibidos na tela, tem 3 pontinhos na frente.

 

Eu olhei no site aqui, e percebi que a função que citei acima não serve, porque o gmail mostra o assunto de acordo com o tamanho da janela, se ela estiver em 640px ele mostra até um certo ponto, se eu redimensionar ela para 800px ele mostra mais um pouco, e no código está o assunto completo. O que eu falei iria cortar o assunto, não serveria nesse caso.

 

Este código para redimensionar o texto dinamicamente parece ser javascript.

[micox 2]

Não é necessário Javascript (apesar de que também dÊ pra fazer).você pode fazer aquilo simplesmente através do overflow:hidden. Daí você coloca o span que terá o texto com largura variável e com altura fixa.Mas também acredito que ele deve usar linguagem server-side (pra complementar) em algum ponto, caso contrário iria carregar muito exibir TODOS os textos de TODOS os emails...

[hargon 64]

Legal... não imaginei que limitando a altura funcionaria com CSS. Vivendo e aprendendo... hehe

 

Fiz um código aqui para testar e funcionou:

<style>
span{
overflow:hidden;
height: 22px;
}

#div1{
width: 100%;
}

</style>

<div id="div1">
<span>
Eu olhei no site aqui, e percebi que a função que citei acima não serve, porque o gmail 

mostra o assunto de acordo com o tamanho da janela, se ela estiver em 640px ele mostra 

até um certo ponto, se eu redimensionar ela para 800px ele mostra mais um pouco, e no 

código está o assunto completo. O que eu falei iria cortar o assunto, não serveria nesse 

caso. 
</span>
</div>

Mas ainda acho que o Gmail utilizou javascript, devido aparecer as reticências quando o texto não aparece todo. Na imagem postada acima não mostra isso, mas quando você entra no e-mail, é possível ver.

 

Até mais.

[micox 2]

Mas ainda acho que o Gmail utilizou javascript, devido aparecer as reticências quando o texto não aparece todo. Na imagem postada acima não mostra isso, mas quando você entra no e-mail, é possível ver.

Concordo

[vdepizzol 0]

Estamos visualizando o gmail em navegadores diferente =)... no internet explorer, o gmail coloca msm as reticências... no firefox, ele simplesmente corta...Vou testar com o código que você falou, micox, e depois eu posto aqui se funcionou =)