title: How can I right-align the contents of a ExtJS tbar?
body: <p>I have a tbar inside a grid panel like this:</p>
  
  <p><img src="https://i.stack.imgur.com/erQiq.png" alt="enter image description here"></p>
  
  <p>This is the code that produces it:</p>
  
  <pre><code>var grid = new Ext.grid.GridPanel({
      region: 'center',
      style: 'margin: 10px',
      store: new Ext.data.Store({
          data: myData,
          reader: myReader
      }),
      title: 'Testing',
      tbar: ['Filters:', {
              width:          100,
              xtype:          'combo',
              mode:           'local',
              value:          'en',
              triggerAction:  'all',
              forceSelection: true,
              editable:       false,
              fieldLabel:     'Produkt',
              name:           'language',
              hiddenName:     'language',
              displayField:   'name',
              valueField:     'value',
              store:          new Ext.data.JsonStore({
                  fields : ['name', 'value'],
                  data   : [
                      {name : 'German',   value: 'de'},
                      {name : 'English',  value: 'en'},
                      {name : 'French', value: 'fr'}
                  ]
              })
  
          }],
  </code></pre>
  
  <p><strong>What do I need to change so that the dropbox is right-aligned instead of left-aligned?</strong></p>
  
  <h1>Addendum</h1>
  
  <p>thanks @dogbane, that works perfectly, here's how I right aligned both text and dropdown:</p>
  
  <pre><code>tbar: [
      {xtype: 'tbfill'},
      'Filters:',
      {
          width:          100,
          xtype:          'combo',
          mode:           'local',
          ...
  </code></pre>