jQuery dialog IE7 issues

Question

I am having trouble with the width of the titlebar in IE7 only. The first dialog function when opened using the width: 'auto' the titlebar does not extend across the entire dialog window. The second function using minWidth works but is acting more like the width property and not growing in size with the content. Any ideas?

Not Working:

        $(dialogId).dialog({
            autoOpen: 'false',
            modal: true,
            draggable: false,
            resizable: false,
            buttons: buttons,
            title: title,
            width: 'auto',
            open: function(){
                /* IE HACK */
                $buttonPane = $(this).next();
                $buttonPane.find('button:first').addClass('accept').addClass('action');
                $('.ui-dialog-titlebar-close').hide();
                $('.ui-dialog').addClass('open_dialog');
                $(this).css('overflow','hidden');// IE hack
                onOpen;
            },
            close: function(){
                $('.ui-dialog').removeClass('open_dialog');
                afterClose;
            }
        });

Working (only as fixed width):

        $('#conf_dialog').dialog({
            dialogClass: dialogclass,
            autoOpen: 'false',
            modal: true,
            draggable: false,
            resizable: false,
            buttons:buttons,
            title:title,
            minWidth: 255,
            open: function(){
                /* IE HACK */
                $buttonPane = $(this).next();
                $buttonPane.find('button:first').addClass('accept').addClass('action');
                $('.ui-dialog-titlebar-close').hide();
            },
            close: afterClose
        });

Answer 1

In theory width:auto is not supported, but it seems to work in IE8 and FF, but not on IE7

I came across this link:

http://ovaraksin.blogspot.com/2011/05/jquery-ui-dialog-with-auto-width-and.html

And adapted it thus:

       $("#myDialog").dialog({ autoOpen: false,
            width: 'auto',
            height: 'auto',
            modal: true,
            title: 'ABC...' 
        }).bind("dialogopen", function (event, ui) {

            // fix for width:auto in IE  
            var contentWidth = $(this).width();
            $(this).parent().find('.ui-dialog-titlebar').each(function () {
                $(this).width(contentWidth);
            });

        }).bind("dialogclose", function (event, ui) {
            //fix for width:auto in IE 
            $(this).parent().css("width", "auto"); 
        });