PDA

View Full Version : How to align fieldlabel



zzhouag
21 Apr 2016, 6:29 PM
hi,

As the picture shows, I want to align the fieldlabel to the same height with the input field. Please help, thanks.

54414

jdkhamba
21 Apr 2016, 6:42 PM
You shouldn't have to do anything at all to align the fieldLabel. It aligns by itself:

https://fiddle.sencha.com/#fiddle/1942

zzhouag
21 Apr 2016, 7:43 PM
You shouldn't have to do anything at all to align the fieldLabel. It aligns by itself:

https://fiddle.sencha.com/#fiddle/1942

But if I set the height of the field, only the input field will be center vertically, fieldlabel still keep on the top.

jdkhamba
21 Apr 2016, 7:47 PM
Can you post a fiddle or code to demonstrate your specific issue?

zzhouag
21 Apr 2016, 7:51 PM
Can you post a fiddle or code to demonstrate your specific issue?

https://fiddle.sencha.com/#fiddle/1943

you can see this, thanks

jdkhamba
21 Apr 2016, 8:02 PM
I see, well one way would be to target the table cell using css:



.main-viewport .x-field-label-cell
{
vertical-align:middle;
}




And then:




Ext.application({
name: 'Fiddle',


launch: function() {
Ext.widget('viewport', {
layout: 'hbox',
cls:'main-viewport',
fieldDefaults: {
height: 100
},
items: [{
xtype: 'datefield',
height: 60,
fieldLabel: 'attribute',
flex:1
}, {
xtype: 'datefield',
fieldLabel: 'to',
flex:1
}, {
xtype: 'datefield',
fieldLabel: 'from',
flex:1
}]



})
}
});

zzhouag
21 Apr 2016, 8:14 PM
That what I need, Thanks!