PDA

View Full Version : pressedCls not working in IE8



AlessandroTorrisi
16 Sep 2014, 12:36 PM
Hello,

i'm trying to use the pressedCls property when using the xtype button.

this is my CSS part


.x-redPressed{
background-color: red !important;
background-image: none !important;
border-color: darkred !important;
}


this is my Extjs part


{
xtype: 'button',
text: 'Red',
enableToggle: true,
pressedCls: 'redPressed'
}


this works fine in Chrome, but in IE8 it is not working. I played allready with the important tag, but that seems not to make any difference in IE8. By the way, IE 9 and above works fine..

scottmartin
16 Sep 2014, 1:03 PM
Have you inspected the buttons in IE8 to see why? ( hint images )

AlessandroTorrisi
16 Sep 2014, 1:13 PM
With the inspector I saw this :



<TD class="x-frame-mc x-btn-mc x-btn-default-small-mc x-btn-default-small-noicon-mc x-btn-default-small-redPressed-mc" id=button-1058-frame1MC role=presentation style="WIDTH: 64px">
<SPAN class=x-btn-wrap id=button-1058-btnWrap role=presentation unselectable="on">
<SPAN class=x-btn-button id=button-1058-btnEl role=presentation>
<SPAN class="x-btn-inner x-btn-inner-center" id=button-1058-btnInnerEl style="WIDTH: 64px" unselectable="on">Red</SPAN>
<SPAN class="x-btn-icon-el " id=button-1058-btnIconEl role=presentation unselectable="on"></SPAN>
</SPAN>
</SPAN>
</TD>


IE9 is rendererd diffrent :



<a tabIndex="0" class="x-btn x-unselectable x-btn-default-small x-noicon x-btn-noicon x-btn-default-small-noicon x-redPressed x-btn-redPressed x-btn-default-small-redPressed" id="button-1058" style="margin: 0px 5px 4px 0px; width: 70px;" hideFocus="on" unselectable="on">
<span class="x-btn-wrap" id="button-1058-btnWrap" role="presentation" unselectable="on">
<span class="x-btn-button" id="button-1058-btnEl" role="presentation">
<span class="x-btn-inner x-btn-inner-center" id="button-1058-btnInnerEl" unselectable="on">Red</span>
<span class="x-btn-icon-el " id="button-1058-btnIconEl" role="presentation" unselectable="on"></span>
</span>
</span>
</a>


I have it now working with this CSS


.x-btn-default-small-redPressed-mc{
background-color: red !important;
background-image: none !important;
border-color: darkred !important;
}