title: changing the default width of bootstrap modal
body: <p>I am trying to change the default width of the dialog but it's not working.I have tried solutions mentioned in <a href="https://stackoverflow.com/questions/10169432/how-can-i-change-the-default-width-of-a-twitter-bootstrap-modal-box/16090509#16090509">this</a> post. Here is my HTML code below:</p>
  
  <pre><code>&lt;style&gt;
  
  #myDialog .modal-dialog{
  
  width:80%;
  
  }
  
  
  &lt;/style&gt;
  
  
  &lt;div id="myDialog" class="modal fade" tabindex="-1" role="dialog"&gt;
      &lt;div class="modal-dialog" role="document"&gt;
          &lt;div class="modal-content"&gt;
              &lt;div class="modal-header"&gt;
                  &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;&lt;i class="fa fa-times"&gt;&lt;/i&gt;&lt;/button&gt;
                  &lt;div class="modal-title" id="Dialog_title"&gt;Text Document&lt;/div&gt;
              &lt;/div&gt;
              &lt;div class="modal-body"&gt;
  
                  &lt;div id="my_doc_content"&gt;&lt;/div&gt;
  
              &lt;/div&gt;
              &lt;div class="modal-footer"&gt;
                  &lt;button type="button" class="btn btn-default" data-dismiss="modal" onclick="rg.closeDialog('myDialog');"&gt;Close&lt;/button&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>