View Full Version : [OPEN] Vertical scroll bar offset in textarea

19 May 2011, 11:23 AM
I've had trouble changing the background color of textarea controls


I tried numerous things and finally got this to work by setting the 'background-image' to 'none' in
the style as well as 'background-color' to whatever.

However when I do this - the vertical scroll bar has a small (in my case black) rectangle to the
right of it, if I set the background color to black for example. I've tried turning padding on/off
and the frame but this doesn't seem to help.

Any idea how to change the color without affecting other bits of the textarea field?

19 May 2011, 4:06 PM
Hmm, I cannot reproduce the issue.

19 May 2011, 10:53 PM
How did you change the color? I used setStyle() on the inputEl as I was unable to find
any other way (that worked) to change the color in a TextArea.

Here is what I see on Firefox 4 running on Fedora.

20 May 2011, 12:45 AM
I see. There must be something wrong with styling in Ext as standalone textarea doesn't exhibit this behavior. I've tested in FF 3.6.15 and FF 4.0.1 @ Mac and the scrollbar is shifted left in both browsers.

This works fine:

<!doctype html>
<title>Black Textarea</title>
<textarea style="width:200px;height:100px;background-color:black;color:white">Hey you</textarea>

Moving this thread to Bugs.

20 May 2011, 8:50 AM
I've tested on various browsers and they seem to show the same behaviour
(scroll bar shifted to left).

26 May 2011, 11:09 PM
The text is also shifted on the left slightly (about 5 pixels). It looks to me as though the textarea is slightly smaller than the panel area it is placed in, but the colour change affects the parent panel giving the extra 5 pixels on each side.

This appears to be the case in all browsers. As such its not really possible to change the background color of a textarea when it has scroll bars.