title: How to fit the columns in a grid automatically in extjs?
body: <p>we have a grid with 6 columns. One column requires more width compae to others. We have to ahow all the columns in that grid without any horizontal scroll bar.</p>
  
  <p>The code we tried for this is:</p>
  
  <pre><code>{
      xtype: 'grid',
  
      viewConfig: {    
          forceFit: true,    
      }
  
      columns: [{    
          header: 'column1'    
      }, {    
          header: 'column2'    
      },
      //...
      {    
          header: 'column6',    
          flex: 2    
      }]
  }
  </code></pre>
  
  <p>The above code worked fine in IE8. But in IE9 and Google Chrome, the 6th column content is not displayed.</p>
  
  <p>Could anyone please suggest how to solve it?</p>