PDA

View Full Version : assign cls-class at em-tag outside buttons



MoePi
14 Nov 2011, 11:07 AM
I would use sprites for icons. But on using iconCls there is a positioning problem:
The icon does'nt stayes at left side. Text covers it.
So I would use <em> tag:

<em class="" unselectable="on">
<button id="xyz" class=" x-btn-text ui-silk ui-silk-note-go" type="button">Speichern</button>
</em>

The css-code is unspectacular:

button.ui-silk{
width : 16px !important;
height : 16px !important;
background : transparent url(/pics-VT/silk-sprite.png) !important;
background-repeat : no-repeat !important;
}
.ui-silk-note-go{
background-position : -336px -0px !important
}
But, if there are any ideas, how I can position sprites at left side, this would be a solution.

I'm sorry for this bad English and thank you in anticipation for your help!

mitchellsimoens
14 Nov 2011, 1:16 PM
var button = new Ext.Button({
renderTo : Ext.getBody(),
text : 'Hello',
iconCls : 'test'
});

Will add 18px to the left and you should place your image int he background of the button tag and have it only 16px by 16px (for each sprite)

MoePi
14 Nov 2011, 1:45 PM
The iconCls works perfect with single images. But I want to use sprites.
The effect will show this screenshot: 29281
The background-image is positioned behind the text.
The padding-left:18px is unchanged...

Hope, this better can explain my question.

Thank you for your quick reply

MoePi
15 Nov 2011, 1:54 AM
I think, I've to overwrite onRender for buttons and especially this part


if(position){
btn = this.template.insertBefore(position, targs, true);
}else{
btn = this.template.append(ct, targs, true);
}

... but I dont now how.

Oh: I'm using V. 3.2.1

MoePi
16 Nov 2011, 2:29 PM
Can anyone give support, Please?
I couldn't solve this problem...

Thanks in advance!