1

ファイルのアップロードにファイルフィールドを使用していて、その横にアップロードボタンを配置しています。長いラベルを配置すると、そのレイアウトが壊れ、アップロードボタンが上部に配置されます。ラベルを「上」に揃えたいボタンを下に揃えるにはどうすればよいですか。

Ext.create('Ext.Container', {
                renderTo: Ext.getBody(),
                bodyPadding: 1,
                width: 400,
                height: 300,
                layout: {
                    type: 'hbox',
                    autoSize: true,
                    align: 'bottom'
                },

                items: [{
                    xtype: 'filefield',
                    labelSeparator: '',
                    fieldLabel: 'When placing long labels the layout is breaking and the upload button is placed at the top.',
                    labelAlign: 'top',
                    buttonText: 'Select',
                    flex: 1                        
                }, {
                    xtype: 'button',
                    text: 'Upload',
                    width: 50
                    //,margin: '22 0 0 2'
                }]

            });
4

1 に答える 1

2

HTMLマークアップから、この問題はレイアウトが原因であることがわかります。上の位置filefieldを259pxと278pxに設定buttonします。ラベルには1行しかないことを前提としています。最も簡単な修正は、cssのラベル要素の高さを33px（2行）に設定することです。

例： http： //jsfiddle.net/VphZH/1/

別の可能性は、拡張filefieldして別のボタンを追加することです。次に、レイアウトに依存しないようにする必要があります。

例： http： //jsfiddle.net/VphZH/3/

于 2012-12-06T19:56:39.837 に答える