PDA

View Full Version : Problem with styling Toolbar in IE



malstroem
4 Apr 2012, 10:59 PM
Hi There,

I am not able to assign a background-image to an Ext.Toolbar with IE (7-9).
With Firefox/Chrome I don´t have problems.

My code is fairly simple - I just add cls:HeaderToolbar wich is defined in my stylesheet


ColoredToolbar=Ext.extend(Ext.toolbar.Toolbar,{
constructor:function(){
var c=arguments[0] || {};
c.height=32;
c.cls="ColoredToolbar";
c.style='padding:5px;';
c.items=[{
xtype:'tbtext',
text: 'Test'
}
];
this.callParent(new Array(c));
},
initComponent:function(){
this.callParent(arguments);
}
});


CSS stylesheet:


.ColoredToolbar{
background:#F0F0F0 url(../Ico/TopPanel.png) repeat-x top left !important;
border:0px;
vertical-align:middle;
color:#ffffff;
overflow:hidden;
height:32px;
}

.ColoredToolbar .xtb-text,
.ColoredToolbar .x-btn-inner,
.ColoredToolbar .x-toolbar-text {
color:#ffffff !important;
font-weight: bold;
font-size: 12px;
}




Firefox33609
IE933610

scottmartin
5 Apr 2012, 7:01 AM
Does it make any difference if you change the modes in DevTools?

Regards,
Scott.

malstroem
5 Apr 2012, 7:06 AM
nope - I tried with diffenet "document-modes" and also the compatibiliy-view
same problem... no styling of the toolbar!

sometimes it seems, that the blue background-icon appears very shortly and then gets "overlayed" by the default grey color.

might be a bug?!

malstroem
5 Apr 2012, 7:10 AM
I also tried componentCls instead of cls - same problem:
Styling with FF/Chrome is working - IE fails

scottmartin
5 Apr 2012, 7:14 AM
sometimes it seems, that the blue background-icon appears very shortly and then gets "overlayed" by the default grey color

This usually means that CSS is getting stepped on by another rule.

Regards,
Scott.

malstroem
5 Apr 2012, 7:18 AM
jeah - but there are NO more css-rules after that...

I just tried to delete every single line of css-declaration after the ".ColoredToolbar"

same Problem... it rather seems to me, that the css is overridden by some Ext code?!

scottmartin
5 Apr 2012, 7:27 AM
Can you create a small example project and submit it to the bug forums and we can proceed from there?

Scott.

malstroem
5 Apr 2012, 7:31 AM
OK. I´ll do that - thanks Scott!