Multiline title in dialog?

Question

How can I have a JQuery Dialog with a title that is more than one line?

See this: http://jsfiddle.net/VKcJ7/7/

I've tried using a newline character, and fiddling with the JQuery UI CSS classes for the title & titlebar, but nothing seems to be working.

JS: / JQuery:

$(document).ready(function () {
    $('#dialog').dialog({
        autoOpen: false,
        modal: true,
        title: 'Something really long wow \n too much to have in a title but oh well'
        //adding the newline character \n does nothing!
    });
});

CSS:

.ui-dialog-title{

}

.ui-dialog-titlebar{

}

Answer 1

The .ui-dialog-title has the css to make overflowing text to be truncated to ... (ellipsis).

white-space: nowrap;
text-overflow: ellipsis;

Using the below css instead should fix this.

white-space: normal;

Edit:

making white-space: normal will ignore the text-overflow declaration.