views:

380

answers:

0

I have a JQuery UI Dialog set up on my page that gets populated with some information (a table and a form) and then displayed with

$("#dialogbox").dialog({
    autoOpen: false,
    resizable: false,
    modal: true,
    width: 500
});

This works perfectly fine in FF but fails horribly in IE7. The problem is that, no matter what I do, the dialog renders at about 1/2 the width of the content, cutting off the other half.

I've pinged the CSS width on the outer div and the inner div of the dialog with $("#dialogbox").css("width") and $("#dialogbox").parent().css("width") - the inner one resolves to 'auto' and the outer to '500', which would be good, except it still renders at about half that width.

Another strange thing: when I set 'resizable: true' on the box itself, it resizes, but only the content resizes horizontally - the outside portion of the box only resizes vertically and stays fixed at its half-width size.

Has anybody else had this problem, and, if so, how have they fixed it?