Hi,

I want to make a form with few comboboxes and a submit button. I am not giving fiixed height and width . So, the components should fit in appropriately if the container size is reduced the componets should wrap or resize appropriately. I tried few layouts but it is not working . Any suggestion will be of great help.
I am trying something like


var panel = new Ext.FormPanel({
id:'main-panel',
baseCls:'x-plain',
renderTo: 'filterDiv',
layout:'anchor',
autoWidth: true,
// width:
// layoutConfig: {columns:9},
// applied to child components
defaults: {frame:true},
items:[
dateRangeCombo,
productsCombo,
customerSegmentCombo,
displayTypeCombo,
submitButon
]
});


also,
var searchForm = new Ext.FormPanel({frame: true,title: 'Search Criteria',labelAlign: 'left',labelStyle: 'font-weight:bold;',labelWidth: 85,renderTo:'sampleDiv',// width: 900, items: [{layout:'column',items:[{ // column #1// columnWidth: .10,//layout: 'form', items: [{xtype: 'label',text:'Date Range:',anchor:'10%' }]},dateRangeCombo,{ items: [{xtype: 'label',text:'Products:',anchor:'10%' }]},productsCombo,{ // columnWidth: .10,// layout: 'form', items: [{xtype: 'label',text:'Customer segment:',anchor:'15%' }]},customerSegmentCombo,{ // columnWidth: .10,// layout: 'form', items: [{xtype: 'label',text:'Display:',anchor:'15%' }]},displayTypeCombo,submitButon]}]

});
none of them is wokring.

regards