Good day, everyone.

I've got small but annoying problem. I'm trying to work with column layout, so here the code
// initializing column panel
var panel = new Ext.Panel({
	border: false,
	autoHeight: true,
	renderTo: Ext.get('applicationBody'),
	cls: 'app-body',
	layout: 'column',
	bodyPadding: '0',
	defaults: {
		border: false,
		autoHeight: true,	
	items: [
			id: 'sidebar',
			cls: 'fb-sidebar',
			width: 200,
			border: true				
			id: 'contentArea',
			columnWidth: 1
// initializing components panel
var componentPanel = new Ext.Panel({
	title: 'Predefined Components',
	cls: 'fp-panel',
	autoHeight: false,
	bodyPadding: '10px',
	border: false,
	collapsible: true, // <---
	maxHeight: 50,
	layout: 'fit',
	items: [ componentView ]

//injecting components panel into a column
var sidebarArea = panel.getComponent('sidebar');
When I try to collapse componentsPanel, it works just fine, but I can't restore it. Seems that height calculations are all wrong. Here is screenshot with some explanations -

Also, I've played with Column layout example -

I set collapsible: true property for the 1st panel (titled "Width=0.25"). Collapse/expand works fine untill window is get resized. After resizing browser window, collapsed/expanded element are not fitting column width, it width stays the same all the time after collapse/expand action.