View Full Version : Browser Conflict

Anisha Jaiswal
10 May 2011, 10:59 PM
I have a TabPanel coded in my .jsp which looks like this:

asrSearchTabs = new Ext.TabPanel({
collapsible: true,
renderTo: 'asrSearchMain',
activeTab: 0,
autoScroll: true,
autoHeight: true,
defaults:{autoHeight: true},
width: document.body.clientWidth,
bodyBorder: true,
{id: 'id_asr_search_panel', contentEl:'tm_vos_div', title: 'Search Criteria'}
listeners: {
collapse: function(p) {
if (asrSearchGrid != null){
expand: function(p){
if (asrSearchGrid != null){

The screen looks perfect on IE8 (See attachments).

But on Mozilla Firefox, the Collapse button makes its own Grid above the TabPanel (See attachments).

11 May 2011, 10:48 AM
Do not post the same question multiple times. Either edit or reply to your own post to add more info. Duplicate thread deleted.

Anisha Jaiswal
11 May 2011, 8:24 PM
The older post is not editable anymore. Neither could I find an option to delete it. Can you suggest a better alternative in this case, than posting the question all over again?

Anisha Jaiswal
12 May 2011, 5:00 AM
Someone help me out of this problem! :(

Anisha Jaiswal
12 May 2011, 9:39 PM
A gentle reminder.

12 May 2011, 10:48 PM
I would blame it on the width. Try setting an exact width to test if that's true.

width: document.body.clientWidth => width: 300

In order to achieve the same width as the component's parent, you should simply use layout: 'fit' on the parent... think that will work.