Search code examples
javascriptcssextjsextjs4

ExtJS - Custom MessageBox icon appearing multiple times

I have an Extjs 4 app with a message box and a custom icon class to show a checkbox. No matter what 32x32 *.png I put there the picture repeats itself.

What's the proper way to format the icon so that it won't repeat?

Evidence

Picture

Code

 Ext.Msg.show({
     title: 'Success',
     msg: 'Control settings changed.',
     icon: 'save-success',
     buttons: Ext.Msg.OK
  });

//CSS
    .save-success{
         background-image: url(../images/icons/accept-1.png);
        width: 32px;
        height: 32px;
     }
Solution

  • In save-success, add no repeat:

    .save-success{
  background-image: url(../images/icons/accept-1.png);
  background-repeat: no-repeat;
  width: 32px;
  height: 32px;
}