fitColumns is not working in firefox3

[rasha.elsayed]

Hi everyone,

I am using a GridPanel, and in response to browser resize, I call fitColumns(false) to recalculate column widths based on the new size. This works fine in IE6,7,8 and FF2.

On FF3 consider the following scenario
=============================
1- Login to the application with the browser maximized.
2- Restore down the browser

The grid width is still bigger than the viewable area.

Also, I don't want to use any scrollbars.

here is my code
==============


Window.addWindowResizeListener(new WindowResizeListener() {
publicvoid onWindowResized(int width, int height) {
gridPanel.fitColumns(false);
}
});
gridPanel.addStyleName("productListGridCSS");
my gridPanel has the following styles applied

.productListGridCSS .x-grid3-header-offset {
width: auto!important;
}
.productListGridCSS .x-grid3-scroller {
height:auto!important;
width: auto!important;
}
.productListGridCSS .x-grid3 {
height:auto!important;
width:100%!important;
min-height:50px;
}
.productListGridCSS .x-grid3-header {
width: auto!important;
}
.productListGridCSS .x-grid3-header-inner {
width: auto!important;
}

I added these styles as fixes to previous bugs including the required fitColumns on browser resize. They are all using (width:auto) to override the fixed values.

I also had a look with firebug: when the browser window is getting smaller the widths are also shrinked (which is right) but not to the right value (a value that is bigger than the browser width!!).

any idea?

Also I want to mention that the opposite scenario is working (login with small browser window then maximize, the columns are enlarged successfully)

Feedback is highly appreciated.

[sven]

Please post some complete testcase that demonstrates the issue.

[rasha.elsayed]

I made some investigations and found that fitColumns is not the problem. The problem is that firefox 3 can't compute the new (smaller) width of the grid correctly. After resizing the new width of the grid is still bigger than the browser width!! (see resize.jpg)

I tried to add the following styles
.productListGridCSS .x-grid3-header-offset table {
width: auto!important;
}

.productListGridCSS .x-grid3-row {
width: auto!important;
}
.productListGridCSS .x-grid3-row table{
width: auto!important;
}

This fixed the resize problem, but unfortunately it contradicts the "table-layout:fixed" style that was made to fix grid layout on ff3. (see wrong_alignment.jpg). Check:
https://bugzilla.mozilla.org/show_bug.cgi?id=400776

Any idea about possible workaround?!!
Thanks in advance