I am a bit confused about how this works. Let me show you what I found:
The "highest" header tag is <div class="x-grid3-header" id="ext-gen17">, and it takes its greenish background from here:
/*
* Ext GWT Library 2.0
* Copyright(c) 2006-2009, Ext JS, LLC.
* licensing@extjs.com
*
* http://extjs.com/license
*/
.x-grid3-header {
background: #f9f9f9 url("WebResource.axd?d=3ncbWb3K_E1Niqrr-dSz-P68QangeISJExadJF6wZEqJt0NK6NMT8G1BhFbPnnVydv65wT-_TeZ0PAQc2DgSaofvdDKjnfgT_dtPawRP73EoJFrbRGvD6JsmZkJjT33Dff0fYLL_ND4hk3sRZO1yA6jsqP9HDCZ9lzat8G5Ua9q2n3UklpzTrYiDD_9X8bZ00&t=635331694741987000") repeat-x 0 bottom;
}
That style is overwriting the gray one, found here:
/*!
* Ext JS Library 3.2.0
* Copyright(c) 2006-2010 Ext JS, Inc.
* licensing@extjs.com
* http://www.extjs.com/license
*/
.x-grid3-header{
background-color:#f9f9f9;
background-image:url("WebResource.axd?d=HbPaKbV2UXuZQX-Gq02RbQ7wTOq95TnYpQ8qVNg46ZpCSXMZ_rW60oUmOKTvNbjKicmbUsfFz33gp6hleg8PJKVM2Mis1sOLDmyK6djchTDWPyQRXG0Cc64s4DW2gDYDDwwwS2Niae4RsB26jnzTZRGlM33YtoHMVcGXpgxCK1XXBB42ZP6EY6msESlQvaj10&t=635331694741987000");
}
On the other hand, in the group header row, each column (td) has the gray background image thanks to their class "ux-grid-hd-group-cell", taken from here:
/*!
* Ext JS Library 3.0+
* Copyright(c) 2006-2009 Ext JS, LLC
* licensing@extjs.com
* http://www.extjs.com/license
*/
td.ux-grid-hd-group-cell {
background: url("WebResource.axd?d=-loflQi2A-7M4lWa5sQYqPkoFLfUBEz1nlLSBK3VIrY0Kt6E3kAEYujAFPyvuc-vceWK53A2HCl6EgwDy5mDz6uzrNqkp2u2OMOBYEACuEYjSxprvSrhyYM5rWeKeI60OX62_RN_BqDc7RN0mBtiZf-8vTfYkfKVLfs3NBGEV9FW_3ESI20G6LQcSI1xwUCp-89XE0YUn8BkSy1FbJ8N1Q2&t=635331694741987000") repeat-x bottom;
}
Is it ok that my site is using all those different css?
Using the untouched group header example from the web has the same issue, so I guess it may be something in the web.config. Any ideas where I should start looking? How can I use ext.axd instead?
Thanks and regards,
Andrew