I am working on applciation which is using ExtJs ver 3.3.1
IE8+ is our primary browser for this application

Earlier this application was not having any doctype hence was working in Quirk mode, I have recently added below line in JSP to make this using correct rendering engine which corrected some layout issues. and Grids on page in the ending was not in symmetry which are now coming fine almost
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
Problem:
Some Grids are in fieldset and some are in a new panel. When I resize my window Grid panel goes inside that panel/frameset and data not visible when maximise window it again comes out and visible fine. How to fix this...any guidance will be helpful.


Here is the structure if page:
1) TabPanel which having a panel(1) - with no layout and autoHeight:true
2) Another panel(2) with layout:fit added to above created panel(1)
3) Later one fieldSet with GridPanel added to a new Panel (3) which is collapsible true => Finally this is also added to main Panel(1) and doLayout()


All grids are using below default viewConfig and collapsible:false, autoHeight:true:

Code:
var gridView = new Ext.grid.GridView({
        forceFit:true,
        emptyText: "No Records....",                    
        deferEmptyText: false
        });
When Window is maximize see all grid columns and search field is visible
Grid1.jpg

When I resized little smaller see search field and grid columns goes invisible inside panel/fieldset
Grid-2.jpg