title: Can't set jQuery dialog to width < 150px
body: <p>I cannot seem to set the width on a jQuery dialog to less than 150px. In other words, if I set it to something less, it will still display it at 150px.</p>
  
  <p>The dialog call:</p>
  
  <p>$('#menu').dialog({modal:false, height:window.innerHeight-20, width:125,dialogClass: "no-close", position: { my: "right bottom", at: "right bottom", of: window }});</p>
  
  <p>Full code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;&lt;/title&gt;
          &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt;
          &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;&lt;/script&gt;
          
          &lt;link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" /&gt;
          &lt;script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"&gt;&lt;/script&gt;
          &lt;script language="javascript"&gt;
              var menuOpen=false;
              function toggleFunctionMenu()
              {
                  if(!menuOpen)
                  {
                      $('#menu').dialog({modal:false, height:window.innerHeight-30, width:125,dialogClass: "no-close", position: { my: "right bottom", at: "right bottom", of: window }});
                      $('#menuButton').html("Close");
                      menuOpen=true;
                  }
                  else
                  {
                      $('#menu').dialog("close");
                      $('#menuButton').html("Open");
                      menuOpen=false;
                  }
              }
  
  
          &lt;/script&gt;
          &lt;style type="text/css"&gt;
              #menu
              {
                  display: none;
                  background-color: yellow;
                  width:100%;
                  height:100%;
                  border-style:solid;
                  border-width: 1px;
                  border-color:black;
                  
              }
  
                #menuButton
                {
                    float:right;
                }
          &lt;/style&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;button onclick="toggleFunctionMenu()" id="menuButton"&gt;Open&lt;/button&gt;
          &lt;div id="menu"&gt;
          &lt;/div&gt;
      &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>