title: jQuery-UI Modal overlay
body: <p>Working with jQuery-UI, I created a 3 button alert for a game I built to add difficulties to it.</p>
  
  <p>When I started writing the script for the alert, the overlay worked fine but now for some reason, it doesn't cover a horizontal strip under the dialog. I am not sure if it's the javascript or the CSS doing this but I need to keep both of them as it is with the full overlay.</p>
  
  <p>jsFiddle example: <a href="http://jsfiddle.net/spedwards/dJVF3/" rel="nofollow">http://jsfiddle.net/spedwards/dJVF3/</a></p>
  
  <p><strong>CSS:</strong></p>
  
  <pre><code>p {
      text-align: center;
  }
  .no-close .ui-dialog-titlebar-close {
      display: none;
  }
  .ui-dialog-titlebar.ui-widget-header {
      background: #104f96; /* Old browsers */
      background: -moz-linear-gradient(top,  #104f96 0%, #157dd3 45%, #54abee 100%); /* FF3.6+ */
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#104f96), color-stop(45%,#157dd3), color-stop(100%,#54abee)); /* Chrome,Safari4+ */
      background: -webkit-linear-gradient(top,  #104f96 0%,#157dd3 45%,#54abee 100%); /* Chrome10+,Safari5.1+ */
      background: -o-linear-gradient(top,  #104f96 0%,#157dd3 45%,#54abee 100%); /* Opera 11.10+ */
      background: -ms-linear-gradient(top,  #104f96 0%,#157dd3 45%,#54abee 100%); /* IE10+ */
      background: linear-gradient(to bottom,  #104f96 0%,#157dd3 45%,#54abee 100%); /* W3C */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#104f96', endColorstr='#54abee',GradientType=0 ); /* IE6-9 */
  }
  div.ui-widget-content {
      background: #74bbf2;
  }
  .ui-widget-content, .ui-dialog-titlebar.ui-widget-header {
      border: 1px solid #fff;
  }
  .ui-state-default {
      border: 1px solid #fff !important;
      background: #539ff5 !important;
      background: -moz-linear-gradient(top,  #539ff5 0%, #78bef8 50%, #6cb7f8 51%, #add9fb 100%) !important;
      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#539ff5), color-stop(50%,#78bef8), color-stop(51%,#6cb7f8), color-stop(100%,#add9fb)) !important;
      background: -webkit-linear-gradient(top,  #539ff5 0%,#78bef8 50%,#6cb7f8 51%,#add9fb 100%) !important;
      background: -o-linear-gradient(top,  #539ff5 0%,#78bef8 50%,#6cb7f8 51%,#add9fb 100%) !important;
      background: -ms-linear-gradient(top,  #539ff5 0%,#78bef8 50%,#6cb7f8 51%,#add9fb 100%) !important;
      background: linear-gradient(to bottom,  #539ff5 0%,#78bef8 50%,#6cb7f8 51%,#add9fb 100%) !important;
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#539ff5', endColorstr='#add9fb',GradientType=0 ) !important;
  }
  </code></pre>
  
  <p><strong>Javascript:</strong></p>
  
  <pre><code>$(function () {
      $('.diff').click(function (e) {
          e.preventDefault();
          $.ui.dialog.prototype._focusTabbable = function(){};
          var dialog = $('&lt;p&gt;Select your difficulty&lt;/p&gt;').dialog({
              resizable: false,
              closeOnEscape: false,
              width: 350,
              modal: true,
              dialogClass: "no-close",
              draggable: false,
              title: 'Difficulty',
              buttons: {
                  "Easy": function () {
                      easy();
                      dialog.dialog('destroy');
                  },
                      "Normal": function () {
                      normal();
                      dialog.dialog('destroy');
                  },
                      "Insane": function () {
                      insane();
                      dialog.dialog('destroy');
                  }
              },
              open: function(e, ui) {
                  $('button').blur();
              }
          });
      });
  });
  
  function easy() {
      alert('You selected Easy');
  }
  
  function normal() {
      alert('You selected Normal');
  }
  
  function insane() {
      alert('You selected Insane! Good luck!');
  }
  </code></pre>
  
  <p>Could someone please explain to me why the overlay doesn't cover the whole window.</p>