pm13
pm13

Reputation: 745

ExtJs IconCls not working in ToolBar

Icons aren't displaying on my gridPanel's toolbar - only the text is being displayed.

Is there a specific css class I should be using? I tried using button.print and just .print but neither work.

,tbar: [
{
     text   : 'Print',
     iconCls: 'print',
     handler: function() {
         Ext.ux.Printer.BaseRenderer.prototype.stylesheetPath = 'css/DETR_WEB.print.css';
         var grid = Ext.getCmp("outstandingGrid");
         alert(grid.title);
         Ext.ux.Printer.print(grid);
    }
}]

.print{
    background-image: url(../images/print.png);
    background-repeat: no-repeat; 
}

Upvotes: 1

Views: 8183

Answers (2)

David
David

Reputation: 1

I was having the same issues when specifying an iconCls with a background-image that the image was appearing for the first level menu items but not for the submenu items. I confirm that adding the !important after the background-iamge definition solved this issue.

Upvotes: 0

Chau
Chau

Reputation: 5570

I had the same problem once, and I found out that a style in Ext is overriding my image. So when dealing with toolbars I always add the !important to the background-image:

background-image: url(../images/print.png) !important;

I have added this answer to clarify that the question has been answered with a solution that seems to help the OP.

Upvotes: 6

Related Questions