Удалить контур от кнопки ExtJS

Question

Я знаю, что для того, чтобы удалить пунктирный контур из ссылки мне нужно сделать следующее:

a, a:active, a:focus { 
    outline: 0 !important; 
} 

Однако при использовании ExtJS кнопки, это не работает.

Я пробовал устанавливать границы никому, а также с использованием контура: none! Important. Однако ни одна из этих вещей не работает. Кроме того, я попытался дать ему очертить ни одного .x-btn, .x-btn-focus, .x-focus и т. Д. Без каких-либо результатов.

Может ли кто-нибудь мне помочь? Я тестирую, используя Ext JS 5.1.1.451 Classic.

EDIT: Мне очень жаль. Я не знаю, как поделиться Sencha Fiddle. Вот тестовый код. Это использует Extjs 5.1

Ext.application({ 
name: 'Fiddle', 

launch: function() { 
    Ext.create('Ext.toolbar.Toolbar', { 
     renderTo: document.body, 
     width: 500, 
     items: [{ 
      // xtype: 'button', // default for Toolbars 
      text: 'Button' 
     }, { 
      xtype: 'splitbutton', 
      text: 'Split Button' 
     }, 
     // begin using the right-justified button container 
     '->', // same as { xtype: 'tbfill' } 
     { 
      xtype: 'textfield', 
      name: 'field1', 
      emptyText: 'enter search term' 
     }, 
     // add a vertical separator bar between toolbar items 
     '-', // same as {xtype: 'tbseparator'} to create Ext.toolbar.Separator 
     'text 1', // same as {xtype: 'tbtext', text: 'text1'} to create Ext.toolbar.TextItem 
     { 
      xtype: 'tbspacer' 
     }, // same as ' ' to create Ext.toolbar.Spacer 
     'text 2', { 
      xtype: 'tbspacer', 
      width: 50 
     }, // add a 50px space 
     'text 3'] 
    }); 
} 
}); 

Вы можете попробовать щелкнуть по кнопке и просмотреть схему ссылки.

Это то, что я имею в виду:

Кроме того, если это поможет, я использую Chrome на Debian.

Answer 1

Override следующий CSS:

.x-btn-focus.x-btn-default-toolbar-small .x-btn-wrap { 
    outline: 1px dotted #333333; 
}