Tree Panel Node Icon

[nMehmood]

I am trying to specify new icon for each node in a tree panel, I have tried using icon and iconCls property. My icons are bigger in size and it does't shrink the icon into the size I am specifying in iconCls class, rather it crops my bigger icon up to the size I specify in css class and display only that cropped portion as node icon.
Cropped Icons.png
When i don't specify iconCls and just use icon property icon stretched out like this;
Streched icon.png
Issue is icon property does not use icon's URL as "src" path rather uses URL in inline style. i.e.

<img class=" x-tree-icon x-tree-icon-leaf icon-adjustsize" role="presentation" style='background-image: url("../icons/guitar_48x48.png");' src="http://ts50/images/default/s.gif"></img>
Css class is;
.icon-adjustsize { height: 16px; width: 16px; vertical-align: middle; background-repeat:no-repeat; background-position:center !important;}

When i change this html manually and specify the src path as background image url it works fine and shrink the icon to proper size. I have hudge number of icons which are being used in my application i cannot remake them to size 16 * 16.

Any help in this regard will be highly appreciated.

[jsakalos]

You are probably looking for background-size CSS3 property.

See also ExtJS Tree Icon Plugin.

[nMehmood]

Thanks jsakalos, that was my thing