JQuery UI Dialog box- TOO WIDE when displayed on small mobile screens
How do I change the width of the jQuery dialog box? I am using it on a mobile website and it works fine for screens that are greater than 320x480. But if the screen is really narrow (like 240 wide), the box is too big for the screen.
I use the following doc type.
<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">
This is the function that calls the dialog.
function dialog2Button(title,message,button1,action1,button2,action2) {
jQuery('#dialogBox').html(message);
jQuery('#dialogBox').dialog({
title: title,
modal: true,
resizable: false,
draggable: false,
buttons: [{
text: button1,
click: function(){
eval(action1);
jQuery(this).dialog('close');
}
},
{
text: button2,
click: function() {
eval(action2);
jQuery(this).dialog('close');
}
}]
});
}