The jQuery dialog box does not appear in the center

advertisements

I am having the same issue as i had in this question but now for all browsers.

Here is the code:

$('form#main').live('submit', function(e) {
        e.preventDefault();
        var $this = this;
        ////console.log('click submit')
        var $div = $('<div>', {
            html: 'Are you sure you want to submit this table?<br/> All undo information will be lost.'
        }).dialog({
            modal: true,
            title: 'Are You Sure?',
            buttons: {
                ok: function() {
                    self.console('clicked ok');
                    $.post($this.action, $($this).serialize() + '&page=' + self.pageOn, function(data) {
                        self.console(data);
                        $('.DEV-time').text("  (File last updated at: " + data.DEV + ")");
                        $('.PROD-time').text("  (File last updated at: " + data.PROD + ")");
                        if(data.ERROR.length > 0){
                            alert(data.ERROR);
                        }
                        self.pageChanged = false;
                        self.origPage = $('#page').clone();
                        self.lastClick = $('#page').clone();
                    }, 'json')
                    $(this).dialog('close');
                },
                cancel: function() {
                    $(this).dialog('close');
                }
            },
            beforeClose: function() {
                $(this).remove();
            }
        })

        $div.dialog('widget').css('margin', '0 auto');

        return false;
    })


In addition to 'margin', you need to give it an explicit css width.