How to auto-center jQuery UI dialog when resizing browser?

Question

When you use jquery UI dialog, all works well, except for one thing. When the browser is resized, the dialog just stays in it\'s initial position which can be really annoyin

Answer 1

Another CSS-only option which works is this. The negative margins should equal half your height and half your width. So in this case, my dialog is 720px wide by 400px tall. This centers it vertically and horizontally.

.ui-dialog {
  top:50% !important;
  margin-top:-200px !important; 
  left:50% !important;
  margin-left:-360px !important
}