ExtJS 5 – setting transparent background on a button isn’t working in IE9

I have an ExtJS app where I’m using some toolbars with a background behind them so I’m making the toolbars and the buttons transparent. Some of my users are still stuck on IE9 (I know) and the buttons aren’t displaying correctly.

See fiddle here for an example: fiddle

In Chrome, or IE 10+, the toolbar button is transparent. It looks like this: enter image description here

In, IE9 however, it looks like this: enter image description here

Fiddle code:

 Ext.onReady(function () {
      var win = Ext.create('Ext.window.Window', {
          layout: 'fit',
          height: 300,
          width: 300,
          autoShow: true,
          tbar: {
              style:'background-color:orange;',
              items: [{
                  text: 'hi',
                  style: 'background:transparent;'
              }]
          },
          html:'some html'
      });
  });


Source: javascript

Leave a Reply