DisplayFields窗体对齐

Question

我需要帮助。我有一个表单，有几个文本字段和显示字段，但有些与文本字段和displayField 不对齐

尽我所能？

编辑/更新：

如果你是对的，我必须更具体的

这是我的代码：

var GridAllUsr = new Ext.form.FormPanel({
        border: true,
        url : 'UpdateUsers',
        id: 'FormUpdt',
        bodyPadding: '15 0 0 5',
        fieldDefaults: {
            labelAlign: 'left',
            labelWidth: '50%'
        },items: [{
                xtype:'displayfield',
                fieldLabel: 'Username ',
                labelStyle: 'white-space: nowrap;font-size:14px',
                name: 'usuario',
                id: 'name_usr',
                margin: '10 0 0 10',
                    },{
                xtype:'textfield',
                fieldLabel: 'Name ',
                emptyText:'Set Name',
                labelStyle: 'white-space: nowrap;font-size:14px',
                name: 'nombre',
                id: 'nom_usr',
                maxLength: 50,
                enforceMaxLength : true,
                margin: '10 0 0 10',
                allowBlank : false
                },{
                xtype:'textfield',
                fieldLabel: 'LastName ',
                emptyText:'Set LastName',
                labelStyle: 'white-space: nowrap;font-size:14px',
                name: 'last_name',
                id: 'ape_usr',
                maxLength: 50,
                enforceMaxLength : true,
                margin: '10 0 0 10',
                allowBlank : false
                }]
    }); 

这是代码，这些是它的图片，我想要这个

https://i.stack.imgur.com/piD7m.png

所以我需要这个

https://i.stack.imgur.com/LtQdV.png

感谢

Answer 1

我已经通过增加组件的宽度解决了这个问题

ej:

宽度：445

应更改宽度以适应其他组件。