jQueryUI Tooltip - Text ohne Leerzeichen überschneidet Tooltip-Container

Question

Ich habe eine Seite in meiner Webanwendung, die zahlreiche Steuerelemente hat, die einen jQueryUI Tooltip anzeigen, wenn er aktiviert ist. Dies funktioniert hervorragend für QuickInfos, die Standardtext mit Leerzeichen enthalten.

Wenn der QuickInfo-Text jedoch keine Leerzeichen enthält, z. B. ein Dateipfad oder ein Datenbankfeldname, überlappt der Text den Tooltip-Container.

Wie kann ich erzwingen, dass der Text in eine andere Zeile umgewandelt wird, wie es der Standard-Tooltip tut?

Vielen Dank im Voraus.

JSFiddle Demo

-Code

$('.jQueryTooltip').tooltip(); 

<p> 
    <span title="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.">Standard tooltip with spaces</span> 
</p> 

<p> 
    <span title="Loremipsumdolorsitamet,consecteturadipiscingelit,seddoeiusmodtemporincididuntutlaboreetdoloremagnaaliqua.Utenimadminimveniam,quisnostrudexercitationullamcolaborisnisiutaliquipexeacommodoconsequat">Standard tooltip without spaces</span> 
</p> 

<p> 
    <span class="jQueryTooltip" title="Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.">jQuery tooltip with spaces</span> 
</p> 

<p> 
    <span class="jQueryTooltip" title="Loremipsumdolorsitamet,consecteturadipiscingelit,seddoeiusmodtemporincididuntutlaboreetdoloremagnaaliqua.Utenimadminimveniam,quisnostrudexercitationullamcolaborisnisiutaliquipexeacommodoconsequat">jQuery tooltip with spaces</span> 
</p> 

Answer 1

Sie diesen Stil verwenden können:

.ui-tooltip { 
    word-wrap: break-word; 
}