title: jQuery UI dialog positioning : adjust position top by 20px -
body: <p>I have a <strong>dialog</strong> that gets filled by an ajax call. I want to limit the <strong>max-height</strong> of <strong>dialog</strong> and also allow it to be <strong>scroll-able</strong> if this <strong>max-height</strong> is exceeded. The code below does exactly what I want. </p>
  
  <p>The catch is I can not move the <strong>top</strong> of the dialog from the <strong>top position</strong>. I can move it left and right. I can't use <strong>center</strong> either as the <strong>dialog</strong> 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.</p>
  
  <pre class="lang-js prettyprint-override"><code>$("#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'
  });
  </code></pre>
  
  <p>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?</p>