PDA

View Full Version : Headers do not align with columns in GridPanel



naddaf
20 Jul 2010, 7:32 AM
Hi.

In my application, I have a number of grid panels and the headers do not align with the columns; headers are a bit "wider" than the columns. This happens on Firefox; in Chrome they align just fine. The Ext library version is 3.0.0. I have attached a screenshot. My grid is created by the following code:
resultGrid = new xg.GridPanel({
store : resultGridStore,
cm : new xg.ColumnModel({
defaults : {
//width : 120,
sortable : false,
menuDisabled: true,
},
columns : [
{
header : "Question",
width : 100,
dataIndex : 'itemId'
},
{
header : "Option 1",
width : 100,
dataIndex : 'option1'
},
{
header : "Option 2",
width : 100,
dataIndex : 'option2'
},
{
header : "Option 3",
width : 100,
dataIndex : 'option3'
},
{
header : "Option 4",
width : 100,
dataIndex : 'option4'
},
]
}),
columnLines : true,
width : 820,
height : 400,
frame : true,
title : '',
iconCls : 'icon-grid'

});

Any help is appreciated.

Thanks,
Ali.

Animal
20 Jul 2010, 7:33 AM
Have you got an in-house stylesheet which breaks Ext's styling?

Animal
20 Jul 2010, 7:33 AM
And what version of Ext and FF?

naddaf
20 Jul 2010, 8:10 AM
Yes, that was the problem, thanks for the pointer.
Ali