title: How to remove extra space inside of jQuery UI dialog box
body: <p>here is my dialog box</p>
  
  <p><a href="https://i.stack.imgur.com/iJfVO.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/iJfVO.jpg" alt="enter image description here"></a></p>
  
  <p>I want to delete or remove the extra spaces inside of dialog box. How can I achieve it?</p>
  
  <p>for extra details here my <strong>HTML</strong></p>
  
  <pre><code>&lt;div id="beneficiaries_window"&gt;
    &lt;?php
      $sql1 = "SELECT * FROM beneficiary WHERE id = '$id'";
      $result1 = mysql_query($sql1);
    ?&gt;
    &lt;table style="border: 2px solid black;margin:auto;"&gt;
      &lt;tr&gt;
        &lt;th&gt;&lt;center&gt;Name&lt;center&gt;&lt;/th&gt;
        &lt;th&gt;&lt;center&gt;Action&lt;/center&gt;&lt;/th&gt;
      &lt;/tr&gt;
    &lt;?php             
      while($row1 = mysql_fetch_array($result1)){
        echo "&lt;tr class='beneficiaries_rows' id='".$row1['id']."'&gt;";
        echo "&lt;td&gt;".$row1['name']."&lt;/td&gt;";
        echo "&lt;td&gt;";
        echo "&lt;button class='edit_beneficiaries'&gt;EDIT&lt;/button&gt;";
        echo "&lt;button class='del_beneficiaries'&gt;X&lt;/button&gt;";
        echo "&lt;/td&gt;&lt;br/&gt;";
        echo "&lt;/tr&gt;";
      }
    ?&gt;
    &lt;/table&gt;
    &lt;/div&gt;
    &lt;button class="beneficiaries" name="beneficiaries"&gt;Beneficiaries&lt;/button&gt;
  </code></pre>
  
  <p>and <strong>jQuery script</strong></p>
  
  <pre><code>jQuery("#beneficiaries_window").dialog({
    modal: true,
    resizable: false,
    draggable: false,
    autoOpen: false,
    buttons:[{
      text: "Close",
      click: function(){
        jQuery(this).dialog("close");
      }
    }]
  });
  
  //beneficiaries open dialog
  jQuery(".beneficiaries").click(function(event){
    jQuery("#beneficiaries_window").dialog("open");
      event.preventDefault();
    });
  </code></pre>
  
  <p>but in my <strong>firebug</strong> i see this <code>&lt;br&gt;'s</code> but their is no <code>&lt;br&gt;</code> inside of the <code>&lt;div&gt;</code></p>
  
  <p><a href="https://i.stack.imgur.com/5q8rk.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/5q8rk.jpg" alt="enter image description here"></a></p>
  
  <p>how can i remove this im clueless about this extra spacing?</p>