PDA

View Full Version : Gap in the textarea between the scroll bar and the border



Qtx
4 Jun 2011, 11:46 AM
In the example form/field-types.html there is a gap, see the screenshot. This is because of the rule


.x-form-text, textarea.x-form-field {
background: url("../../resources/themes/images/default/form/text-bg.gif") repeat-x scroll 0 0 white;
border: 1px solid #B5B8C8;
padding: 1px 3px;


}



For the textarea, the padding should be


textarea.x-form-field
{
padding: 1px 0px 0px 1px;
}

in order the scroll bar to be positioned tightly

adrianmirjan
26 Jul 2011, 8:12 AM
I think padding config property is not read properly by TextArea.
Even if you set it to zero there are still gaps from left and right.

adrianmirjan
25 Sep 2012, 8:02 AM
I have tested this on 4.1.2
Basically this is default browser behaviour.
If you give a padding to <textarea> it will push the scrollbar on the right.
To get rid of this ugly padding you could override default ExtJS style:


textarea.x-form-field {
padding: 1px 3px;
}
to


textarea.x-form-field {
padding: 1px 0 1px 3px;
}

or have your own custom style.