How to avoid big looking dialog title in jquery ui?

Question

I am using jQuery UI 1.8 and have the following code:

var newDiv = $(document.createElement('div')); 
$(newDiv).html('hello there');
$(newDiv).attr('title','Dialog Title');
$(newDiv).css('font-size','62.5%');
$(newDiv).dialog();

For some reason the Title looks really big, see this jsFiddle for an example.

If there any way to make this look more like the version in the jQuery demo?

Answer 1

you can use this css rule to apply smaller font size:

.ui-dialog{font-size: 62.5%;}

Answer 2

.ui-dialog-title {
    font-size:14px !important;
}

http://jsfiddle.net/WwVgn/6/