como poner tres puntos suspensivos en un div

[roboty]

Hola si tento un div con un ancho de 300px por ejemplo y un alto de 100px, como puedo hacer para que el contenido que sobresale se oculte y muestre tres puntos suspensivos probe algo asin:

Código HTML:

<style>
.texto{
        width:300px;
         height:100px;
        word-wrap:break-word;
        overflow:hidden;
        text-overflow: ellipsis; 
        padding:10px;
}
</style>
<div class='texto'>
Hola si tento un div con un ancho de 300px por ejemplo y un alto de 100px, como puedo hacer para que el contenido que sobresale se oculte y muestre tres puntos suspensivos probe algo asin:
</div>
 

no funciona alguna ayuda?
saludos.

[Rafael]

¿Y si pones

Código CSS:

div:after {content:"...";}
 

?

[pzin]

Con CSS la única solución es imitarlo, porque lo de ellipsis sólo funciona en textos de una linea, por eso siempre se usa junto a white-space: nowrap.

Aquí hay una solución para hacerlo multilinea: http://www.mobify.com/blog/multiline...is-in-pure-css

Luego supongo que con JavaScript habrán varias soluciones pululando por ahí.

[roboty]

Hola, la verdad que no se que decir jeje bueno Rafael eso no me vale pero gracias por la colaboracion no me vale porque los puntos suspensivos me lo pone al final y justo eso es lo que oculto con overflow:hidden, pzin parece buena solucion pero demasiado para un simple efecto pero se agradece la colaboracion.

Saludos.