How can I move the close button in a jquery UI dialog box?


I'd like to move the close button in the top right hand corner of the UI Titlebar away from the actual titlebar. I've looked through the documentation and through other SO questions but can't find the solution.

Has anyone ever done this before.

n.b. I can remove the titlebar but that also removes the close button, similarly I can remove the close button or move it anywhere on the titlebar but not away from the titlebar.


You can do that.

button.ui-dialog-titlebar-close {
  top:60px !important;

Try it on JSFiddle too