CODEWITHSUNDEEP
cssextjs4extjs4.1
Sharon Watinsan
Sharon Watinsan

Reputation: 9840

Style a button in EXTJS

I have a button. and i need to align it to the right, make the font size increase and bold etc. When i googled it says i should use CSS.

How can i use CSS, to style the button that i added ?

My Question :

Where should i add the CSS file in my application, and how can i use it to style the button ?

items: [
                 {
                     xtype: 'button',
                     align: 'right',
                     text:'Assign' 
                 }
             ]

Upvotes: 2

Views: 18958

Answers (1)

Mats Bryntse
Mats Bryntse

Reputation: 564

items: [
                 {
                     xtype: 'button',
                     align: 'right',
                     text:'Assign',
                     cls : 'foo' 
                 }
             ]

And in a CSS file:

.foo { background:black; }

This adds a CSS class to the outer most element of the Button. There may be many elements involved in the DOM markup, so use Firebug to figure out which elements you want to style. More details in Ext docs: http://docs.sencha.com/ext-js/4-0/#!/api/Ext.button.Button-cfg-cls

Upvotes: 5

Related Questions