2009-08-05 18 views
5

en Gmail, muestran lacómo clip de texto en CSS como Gmail no a los correos electrónicos listados sujetos

tema - seguido de un breve fragmento del cuerpo

y parece que el cuerpo del texto se recorta, estoy asumiendo esto se hace con CSS, hojas de estilo Gmail son bastante complejos, por lo que no estoy seguro

todos modos sólo partes de las letras se muestran al final de la línea donde son cortados

¿alguien sabe cómo puedo lograr el mismo efecto, entonces obtengo texto de cuerpo entero en una columna


consiguió sussed gracias @cletus

sólo para aclarar, esto es lo que terminó con

<div style="overflow: hidden; height: 20px;">mytitle<span style="color: gray; "> - my long description goes here</span></div> 

Respuesta

3

Es overflow: hidden CSS de los elementos de bloque. La parte del elemento a nivel de bloque es importante. Ver The CSS Overflow Property.

+0

así que acaba de dar a esto un ir

mytitle - my long description goes here
, pero tiene varias líneas en lugar de recorte, estoy haciendo las cosas bien? – bumperbox

+0

Si quiere ayuda con un ejemplo, le sugiero que lo publique aquí o lo publique como una nueva pregunta. Los comentarios no son una excelente manera de hacerlo. El enlace que publiqué tiene muchos ejemplos, por lo que te sugiero que los consultes también, especialmente la página de demos http://css-tricks.com/examples/OverflowExample/ – cletus

+0

Esto solo funciona si tu div es de ancho fijo. Gmail no es fijo. Todas las columnas son de ancho fijo excepto por la columna Asunto que es automática. Esto no funciona cuando su tabla es 100% como gmail y cuando solo una columna está configurada en automático mientras que las otras están corregidas. ¿Alguien sabe cómo lo hace Gmail? – EdenMachine

8

Para obtener el efecto de recorte de texto completo, donde solo partes de cartas muestran al final del elemento, basta con añadir:

white-space: nowrap; 
Cuestiones relacionadas