[Solved] IEでEditorGridPanelのレイアウトが崩れる現象

[kuro]

添付したスクリーンショット（1つめ）のような、ごく基本的なEditorGridPanel があります。

FireFoxでは問題なく動作していますが、ＩＥの場合（IE6、IE7とも）、スクリーンショット（2つめ）のように操作中にレイアウトが崩れてしまいます。

いろいろと調べてみたところ、どうやらEditorGridPanelの「viewConfig」が悪さしている感じです。
このオプションは、各行の幅をグリッドパネルの横幅と一致させる目的で次のように使用していますが、IEとの相性が良くないのかもしれません。

viewConfig : { forceFit: true }この部分をコメントアウトすると、問題が改善します。
何か、解決策がありましたらご助言をお願いします。

一応、実際のコードも添付します。


var store = new Ext.data.SimpleStore({
fields: [
{ name: 'name', type: 'string' },
{ name: 'section', type: 'string' },
{ name: 'post', type: 'string' },
{ name: 'age', type: 'int' }
],
data: [
['山田 太郎', '総務課', '課長', 48],
['鈴木 一郎', '総務課', '係長', 36],
['田中 洋子', '総務課', '主任', 24],
['山本 昭夫', '経理課', '課長', 43],
['岡本 翔子', '経理課', '係長', 39],
['高田 伸二', '経理課', '主任', 29],
['佐藤 康夫', '営業課', '課長', 51],
['斉藤 浩一', '営業課', '係長', 35],
['中島 美紀子', '営業課', '主任', 23]
]
});

var cols = [
new Ext.grid.RowNumberer(),
{ header: "氏名", dataIndex: "name", sortable: true, editor: new Ext.form.TextField() },
{ header: "所属", dataIndex: "section", sortable: true, editor: new Ext.form.TextField() },
{ header: "役職", dataIndex: "post", sortable: true, editor: new Ext.form.TextField() },
{ header: "年齢", dataIndex: "age", sortable: true, editor: new Ext.form.NumberField() }
];

var grid = new Ext.grid.EditorGridPanel({
title: "社員リスト",
collapsible: true,
store: store,
columns: cols,
width: 600,
height: 400,
viewConfig: { forceFit: true }, // ←この行が原因か？
clicksToEdit: 1,
renderTo: "container"
});

[yuki]

↓と同じ症状ですかね？

http://extjs.com/forum/showthread.php?p=297096#post297096

[kuro]

yuki さんのご指摘通り、同じ現象だと思います。
お知らせいただいたスレッドの情報を参考に対応したところ、見事解決できました。
ありがとうございました。