ExtJS水平滾動條阻止TabPanel中的選項卡標題

Question

這是一個我很難研究和追蹤的問題。在視圖中加載以下面板時，滾動條會出現在每個標籤標題上（不是所有標籤頁的長滾動條，而是單個標籤標題）。這對我來說並不是一個大問題，因爲我在使用小型滾動條的Mountain Lion上，但其他用戶在較舊的OS X版本中有巨大的藍色滾動條阻止整個標籤標題。

我會後的截圖，當我得到一個，但這裏的代碼：

Ext.define('App.view.case.CasePanel', { 
    extend: 'Ext.panel.Panel', 
    alias : 'widget.case-panel', 
    title : 'Edit Case', 
    layout: 'fit', 
    border: false, 
    autoScroll: true, 
    constrainHeader: true, 

    initComponent: function() { 
     this.items = [{ 
      xtype: 'panel', 
      autoScroll: true, 
      layout: 'border', 
      items: [{ 
       region: 'west', 
       xtype: 'case-edit-case-info', 
       split: true, 
       border: true, 
       width: 300 
      },{ 
       region: 'center', 
       xtype: 'tabpanel', 
       activeTab: 0, 
       autoScroll: true, 
       border: false, 
       defaults: {border:false, bodyStyle:'padding:5px'}, 
       items: [{ 
        title: 'One', 
        xtype: 'case-edit-tab-one' // these aren't the actual tab names, but you get the idea. 
       },{ 
        title: 'Two', 
        xtype: 'case-edit-tab-two' 
       },{ 
        title: 'Three', 
        xtype: 'case-edit-tab-three' 
       },{ 
        title: 'Four', 
        xtype: 'case-edit-tab-four' 
       },{ 
        title: 'Five', 
        xtype: 'case-edit-tab-five' 
       },{ 
        title: 'Six', 
        xtype: 'case-edit-tab-six' 
       },{ 
        title: 'Seven', 
        xtype: 'case-edit-tab-seven' 
       }] 
      }] 
     }]; 

     this.bbar = [{ 
      text: 'Save', 
      action: 'save' 
     }, { 
      text: 'Cancel', 
      action: 'cancel' 
     }]; 

     this.callParent(arguments); 
    } 
}); 

任何想法，爲什麼它這樣做呢？

（Mac OS X的最新的Chrome版本）

Answer 1

嘗試從第一面板中刪除自動滾屏：

initComponent: function() { 
    this.items = [{ 
     xtype: 'panel', 
     autoScroll: true, 
     layout: 'border', 
     ... 
    }] 
}