Выравнивание по вертикали в extjs

Question

Как вертикальное выравнивание выпадающего списка вверху в примере ниже? (Попытка заставить его работать в sencha fiddle)

Ext.application({ 
    name : 'Fiddle', 

    launch : function() { 


     // The data store containing the list of states 
var states = Ext.create('Ext.data.Store', { 
    fields: ['abbr', 'name'], 
    data : [ 
     {"abbr":"AL", "name":"Alabama"}, 
     {"abbr":"AK", "name":"Alaska"}, 
     {"abbr":"AZ", "name":"Arizona"} 
     //... 
    ] 
}); 

// Create the combo box, attached to the states data store 
Ext.create('Ext.form.ComboBox', { 
    fieldLabel: 'Loooooong Looooong looooooong looooooong looooooong', 
    store: states, 
    queryMode: 'local', 
    displayField: 'name', 
    valueField: 'abbr', 
    renderTo: Ext.getBody() 
}); 
    } 
}); 

Answer 1

Дайте baseBodyCls к combobox & в CSS дают vertical-align:top; к этому класса.

Ext.application({ 
 
    name : 'Fiddle', 
 

 
    launch : function() { 
 

 

 
     // The data store containing the list of states 
 
var states = Ext.create('Ext.data.Store', { 
 
    fields: ['abbr', 'name'], 
 
    data : [ 
 
     {"abbr":"AL", "name":"Alabama"}, 
 
     {"abbr":"AK", "name":"Alaska"}, 
 
     {"abbr":"AZ", "name":"Arizona"} 
 
     //... 
 
    ] 
 
}); 
 

 
// Create the combo box, attached to the states data store 
 
Ext.create('Ext.form.ComboBox', { 
 
    fieldLabel: 'Loooooong Looooong looooooong looooooong looooooong', 
 
    store: states, 
 
    queryMode: 'local', 
 
    displayField: 'name', 
 
    valueField: 'abbr', 
 
    baseBodyCls:'vertical-align-body', 
 
    renderTo: Ext.getBody() 
 
}); 
 
    } 
 
});

.vertical-align-body{ 
 
vertical-align:top; 
 
}

  <link rel="stylesheet" href="https://extjs.cachefly.net/ext-4.1.1-gpl/resources/css/ext-all.css"> 
 
<script type="text/javascript" src="https://extjs.cachefly.net/ext-4.1.1-gpl/ext-all-debug.js"></script>