Steffen: Abgeschnittenen Text (text-overflow ellipsis) einblenden

Beitrag lesen

Hallo,

ich war möglichst auf der Suche nach einer nativen Lösung, wenn halt möglich mit CSS.

Beim Lesen Eurer Antworten ist mir eine Idee gekommen, die für meinen Fall gut funktioniert und rein auf CSS basiert.

  
.unwrapable {  
    white-space: nowrap;  
    text-overflow: ellipsis;  
    overflow: hidden;  
}  
.unwrapable:hover {  
    text-overflow: inherit;  
    overflow: visible;  
}  

Ich deaktiviere einfach die Ellipsis "onmouseover" und zeige den Text an.

Es muss jetzt natürlich jeder für sich selbst entscheiden, ob und wie das passt. Außerdem kann man ja den :hover-Style noch je nach Bedarf gestalten. (Stichwort: position, z-index, background, ...)

Grüße

  • Steffen