PDA

View Full Version : Combobox inside toolbar - trigger does not align properly



javadecaf
16 Jun 2014, 7:36 PM
I have a combobox inside a toolbar, but the trigger (down arrow) isn't aligned with the box. (I have tested in current Chrome and IE). Here's the relevant portion of my code:



Ext.define('Maverick.grid.techClockEntries', { extend: 'Ext.grid.Panel',
id: 'tech-clock-entries-grid',
renderTo: Ext.get('tech-clock-entries-grid-container'),
store: techClockEntriesStore,
features: [filtersCfg],
title: 'Tech Clock Entries',
columns: [{ ... }],
dockedItems: [{
xtype: 'toolbar',
id: 'tech-clock-entries-grid-toolbar',
store: techClockEntriesStore,
dock: 'top',
displayInfo: true,
items: [
{
xtype: 'combo'
}
]
}

[

... and here's what it looks like:

49383

Can anyone give me any idea what I'm doing wrong?

Gary Schlosberg
20 Jun 2014, 12:29 PM
In which version of ExtJS are you seeing this? I cobbled together an example from the docs and your code and it seems to work without that problem.
https://fiddle.sencha.com/#fiddle/6sj

Could you be affecting it with some CSS somewhere?

javadecaf
20 Jun 2014, 12:51 PM
Yes, it turns out it was a problem with my CSS :"> I had a universal "padding" setting for input elements. I tried to use Firebug to find that sort of problem, but for some reason it didn't show up - perhaps because ExtJS replaces the input element entirely? The only way I found it was by disabling all my external CSS, and working through the process of elimination.

Thanks for your analysis!