Jqueryui: how to make a shadow around a dialog box?

Question

I'm trying to put a drop shadow around a jqueryui dialog box. Something like:

<div id="dialog-form" class="ui-widget-shadow ui-corner-all">
    Some stuff in the box with a shadow around it
</div>

and then doing:

$(function () {
  $("#dialog-form").dialog({
    resizable: false,
    height: 300,
    width: 350,
    modal: true
  });
});

in the javascript section. How can I make a shadow around the dialog-form dialog?

Answer 1

Use dialogClass to add class to the dialog

http://jqueryui.com/demos/dialog/#option-dialogClass

$(function () {
  $("#dialog-form").dialog({
    dialogClass: 'ui-widget-shadow',
    resizable: false,
    height: 300,
    width: 350,
    modal: true
  });
});

Answer 2

Does anyone know of a solution for this?