Hope this helps:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="ext/resources/css/ext-all.css" />
<!-- Ajax Stack -->
<script type="text/javascript" src="ext/yui-utilities.js"></script>
<script type="text/javascript" src="ext/ext-yui-adapter.js"></script>
<script type="text/javascript" src="ext/ext-all.js"></script>
<!-- End Ajax Stack -->
<script type="text/javascript">
Ext.onReady( function(){
var layout = new Ext.BorderLayout( 'system_container', {
center: {
autoScroll: true
},
east: {
title: "Instant Suggestions (click titles below)",
split: true,
initialSize: 275,
minSize: 275,
autoScroll:true,
collapsible:true,
collapsed:true,
titlebar: true,
resizable: false
}
});
layout.beginUpdate();
layout.add( 'center', new Ext.ContentPanel( 'center_container' ) );
layout.add( 'east', new Ext.ContentPanel( 'east_container' ) );
layout.endUpdate();
});
</script>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<center>
<div id="system_container" style="width:830px;height:510px;" align="left">
<div id="center_container">
</div>
<div id="east_container">
</div>
</div>
</center>
</body>
</html>
Cheers.
Alex