I have a dialog that gets filled by an ajax call. I want to limit the max-height of dialog and also allow it to be scroll-able if this max-height is exceeded. The code below does exactly what I want.
The catch is I can not move the top of the dialog from the top position. I can move it left and right. I can't use center either as the dialog is displayed in a large scroll-able window. If I use firebug I can adjust the top property but cannot find where it is being set to zero.
$("#your-dialog-id").dialog({
open: function(event, ui) {
$(this).css({'max-height': 500, 'overflow-y': 'auto'});
},
autoOpen:false,
modal: true,
resizable: false,
draggable: false,
width: '690',
closeOnEscape: true,
position: 'top'
});
I want to adjust the dialog's y position so it is 20px from the top of the window. Any idea what I can do?
Changing the last value solved the problem:
position: ['center',20]