PDA

View Full Version : [3.0] Changing field height



Mchl
24 Nov 2010, 4:18 AM
How can I change the default height of Ext.form.Field?

It seems that whatever I try (see list below) gets overriden by


.x-form-text {
height:16px !important;
}

from ext-all.css

Things I tried:
- setting height property
- defining my own class (using !important) and setting cls property
- defining my

.x-form-text {
height:26px !important;
} class and putting it in the source after the original
- setting style property

The field is in the toolbar defined like this:


{
xtype: 'toolbar',
items: [
{
xtype: 'field',
name: 'IndeksPunktu',
width: 50
},
]
}

Condor
24 Nov 2010, 4:27 AM
The height of a field in a toolbar isn't defined by that css rule!

It's defined by:

.x-small-editor .x-form-text {
height:20px;
}
.ext-ie6 .x-small-editor .x-form-text, .ext-ie7 .x-small-editor .x-form-text {
height:20px !important;
}
.ext-strict .x-small-editor .x-form-text {
height:16px !important;
}
.ext-ie6 .x-small-editor .x-form-text, .ext-ie7 .x-small-editor .x-form-text {
height:20px;
}
.ext-border-box .x-small-editor .x-form-text {
height:20px;
}

Mchl
24 Nov 2010, 4:50 AM
Ahh... I fell victim to line-wrap in firebug.

I created

.ext-strict .x-small-editor .myclass {
height: 26px !important;
}
(I only need to cater for FF)

and set cls property to 'myclass'.

Many thanks!