Extjs Я не могу разделить элементы панели и кнопки

#javascript #extjs

#javascript #extjs

Вопрос:

 var panelMain = new Ext.Panel({
        ,autoHeight: true
        ,autoWidth: true
        ,bodyStyle: 'padding:10px'
        ,nombreTab : 'cabeceraDinamica'
        ,items:[
                    {
                        style: 'float:left;'
                        ,border: false
                        ,items:[panelColumna1,fileBtn]
                    }
                ]
    });
 

Я не могу разделить элементы панели и кнопки, я попытался в стиле добавить margin-bottom: 20px;
Как я мог это решить? Поскольку оба элемента отображаются вместе внизу

panelColumna1 —> является файлом panelBtn —> является btn

  var fileBtn =  new Ext.Button({
        text    : 'Botón prueba',
        id: 'botonId',
        handler : myBtnHandler
    });
 

Ответ №1:

Вы можете использовать свойство margin . https://fiddle.sencha.com/#view/editoramp;fiddle/3avt

 var fileBtn = new Ext.Button({
    text: 'Botón prueba',
    id: 'botonId',
    margin: {
        top: 10,
        left :0
    }
});
var panelColumna1 = new Ext.Panel({
    title: 'panelColumna1'

});

var panelMain = new Ext.Panel({
    autoHeight: true,
    autoWidth: true,
    renderTo: Ext.getBody(),
    items: [{
        style: 'float:left;',
        border: false,
        items: [panelColumna1, fileBtn]
    }]
});