Question

Extjs布局问题

panel中一行显示两个控件。一个textfield一个button，
画面显示之后textfield和button的位置有点错位。
不知如何解决。
如果把button换成另一个textfield显示就正常。
请知道的朋友指点一下。谢谢

附上代码
Ext.onReady(function(){
var form = new Ext.Panel({
title : "panel",
width : "500",
height : "300",
layout : "table",
frame : true,
items : [{
labelAlign : "right",
layout : "form",
items : [{
hideLabel: false,
xtype : "textfield",
fieldLabel : "text1",
width : 260
}]
},{
layout : "form",
items : [{
xtype : "button",
text : "button"
}]

}]
});
form.render(document.body);
})
感谢1楼朋友的回答。可是我现在得代码就是利用了table布局。不知是否看到了我的截图。右边的按钮比左边的文本框稍微的靠下了一点。这个问题不知如何解决。。
另外。如果用column布局，为何在ie中如果不写columnWidth属性的话同一个column的两个控件会显示在两行中？
在firefox中就没事

Answer 1

左右的布局可以考虑换成column布局或table布局
var form=new Ext.FormPanel({
width: 500,
frame : true,
layout:'table',
layoutConfig: {columns:9},
items: [
{
columnWidth :.25,
defaults: {width: 120},
align :'left',
layout:'form',
border : false,
items:[{
hideLabel: false,
xtype : "textfield",
fieldLabel : "text1",
width : 260
}]
},{
border : false,
width:10
},{
layout :'form',
width:100,
border : false,
items : [ {
xtype : "button",
text : "button"
} ]
}
]
});