title: Why does the table not stretches to 100% width
body: <p><img src="https://i.stack.imgur.com/cVA5N.jpg" alt="enter image description here"></p>
  
  <p>Above is the image, where left side is an accordion, and right side is content part (inside a table) I am concerned about the content part(right side) why is the table not 100% width? while the heading on top of it is expanded to full page width. Given below is my code for the <code>content</code>.</p>
  
  <pre><code>var i=0;
  var filesystem=[];
  $(xml).find('file').each(function(){ 
      //console.info($(this).attr('total')+", "+$(this).attr('free')+", "+$(this).attr('used')+", "+$(this).attr('percentage'));
      var row={};
      row.id=i++;
      row.total=$(this).attr('total');
      row.free=$(this).attr('free');
      row.used=$(this).attr('used');
      row.percentage=$(this).attr('percentage');
      filesystem.push(row);
  });
  
  
  $('#detailTable').empty();
  $('&lt;div width="100%"&gt;')
  .attr('id','diskUsageSpan')
  .html('&lt;div class="titleBlue"&gt;Configuration&amp;gt;System&amp;gt;Disk Usage&lt;/div&gt;'+
          '&lt;table id="list1" width="100%"&gt;&lt;/table&gt;'+
          '&lt;div id="gridpager"&gt;&lt;/div&gt;'+
      '&lt;/div&gt;')        
  .appendTo('#detailTable');    
  
  
  jQuery("#list1").jqGrid({
      datatype: "clientSide",
      height: 250,
         colNames:['id','Total Space','Free Space', 'Used Space', 'Used Percentage'],
         colModel:[
             {name:'id',index:'id', width:90, align:"right"},
             {name:'total',index:'total', width:90, align:"right"},
             {name:'free',index:'free', width:90, align:"right"},
             {name:'used',index:'used', width:90, align:"right"},
             {name:'percentage',index:'percentage', width:120, align:"right"}
         ],
         pagination:true,
         pager : '#gridpager',
         rowNum:10,
      viewrecords: true,
      gridview: true,
      edit:false,
      add:false,
      del:false
  
  });
  
  
  for(var i=0;i&lt;filesystem.length;i++)
      jQuery("#list1").jqGrid('addRowData',i+1,filesystem[i]);
  
  jQuery("#list1").setGridParam({rowNum:10}).trigger("reloadGrid");
  </code></pre>