287297 - Horizontal scroll bar obstructs view of textarea

Status: RESOLVED WORKSFORME

(Core :: Layout: Form Controls, defect)

Description

[Tom Honermann]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.7.6) Gecko/20050225 Firefox/1.0.1
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.0; en-US; rv:1.7.6) Gecko/20050225 Firefox/1.0.1

Please take a look at http://www.honermann.net/tom/firefox/

This page shows an example where a horizontal scroll bar will popup and obstruct
the user's view of a 'textarea' edit box when the user enters enough non-space
characters to exceed the visible region of the edit box.

Reproducible: Always

Steps to Reproduce:
1. Create a page with the following html:
<form>
<textarea style="width:468px; height:24px; " cols="64" rows="1"
wrap="virtual"></textarea>
</form>
2. Load the page in FireFox.
3. Fill in the textarea with non-space characters past the visible area of the
textarea.


Actual Results:  
A horizontal scroll bar will popup and obstruct the view of the textarea.

Expected Results:  
Allowed the text to word-wrap with a vertical scroll bar, or scroll without a
horizontal scroll bar (ie, scroll via cursor only)

Comment 1

[Elaine]

I encountered the same issue as well and it's making the textarea unusable.
A textarea with 1 row should scroll like a text INPUT. 

Comment 2

[Josef Johansson]

Found this bug through out the firefox versions, even the latest.
This goes for Windows XP as OS too.

Comment 3

[Gervase Markham [:gerv]]

This is an automated message, with ID "auto-resolve01".

This bug has had no comments for a long time. Statistically, we have found that
bug reports that have not been confirmed by a second user after three months are
highly unlikely to be the source of a fix to the code.

While your input is very important to us, our resources are limited and so we
are asking for your help in focussing our efforts. If you can still reproduce
this problem in the latest version of the product (see below for how to obtain a
copy) or, for feature requests, if it's not present in the latest version and
you still believe we should implement it, please visit the URL of this bug
(given at the top of this mail) and add a comment to that effect, giving more
reproduction information if you have it.

If it is not a problem any longer, you need take no action. If this bug is not
changed in any way in the next two weeks, it will be automatically resolved.
Thank you for your help in this matter.

The latest beta releases can be obtained from:
Firefox:     http://www.mozilla.org/projects/firefox/
Thunderbird: http://www.mozilla.org/products/thunderbird/releases/1.5beta1.html
Seamonkey:   http://www.mozilla.org/projects/seamonkey/

Comment 4

[Tom Honermann]

This bug is still present in FireFox 1.07 and can be confirmed by visiting
http://www.honermann.net/tom/firefox/ and following the instructions there.

Comment 5

[Jo Hermans]

works for me in Firefox 1.5 beta 2 (which is what the auto-resolve mail asked)

Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O; en-US; rv:1.8b5) Gecko/20051014
Firefox/1.4.1

Comment 6

[Tom Honermann]

Tested with Firefox 1.5 on Linux.  This bug is still reproducible and can be confirmed by visiting
http://www.honermann.net/tom/firefox/ and following the instructions there.

Comment 7

[Elaine]

This bug is still reproducible with Firefox 1.5. Here's the html snipplet

<textarea wrap="off" id="inputbox" style="top:20; left:66; width:101; height:21; overflow:hidden; " rows=1></textarea>

Just keep typing in characters into the textbox until you see a scrollbar

Comment 8

[Tom Honermann]

This bug is still reproducible in FireFox 2.0 - "Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1) Gecko/20061010 Firefox/2.0"

This bug is extremely easy to reproduce.  Just go to http://www.honermann.net/tom/firefox/ and follow the directions there.

Comment 9

[Wayne Mery (:wsmwk)]

Jo, does it really not happen on MAC? 

textarea scrolled with vertical scroll bar is bug 82160, which I guess is the behavior you want.  But there is no movement in bug 82160 so don't hold your breath on getting it.

At first I thought rows=1 was the issue, which would be bug 72127, but no.  A reduced testcase of just style="height: 24px;" is sufficient to cause your problem.  With only rows=1 and no height specified there is enough room for horizontal scroll bar and text of at specified font size.  

I don't see how you can get what you want right now, but maybe someone in the mozillazine forums can help you.  

Jo, any suggestion on how to proceed with this bug?


[hardly worth noting but I will anyway - this is worse on w2000 than XP (though XP is no more usable than w2000). On XP with default theme a 1px blank text area appears above horizontal slider (just as in your pre-1.0.7 example from w2000), but on w2000 the slider takes all of your specified 24px textarea height. Note these are different systems with different screen sizes and different resolutions]

Comment 10

[Samuel Sidler (old account; do not CC)]

I can reproduce this on Mac and Windows. -> Core

Comment 11

[Walter Gregg]

Visually, the identical bug occurs if you try to use Google Spreadsheets.  Go to spreadsheets.google.com (you need a free account).  Create a new spreadsheet.  Put the cursor on any empty cell.  As soon as you type anything, a horizontal scrollbar pops up and totally obscures the text entry area.  You have to type in the blind.  This makes Google spreadsheets essentially unusable.  Oddly, I can't find any complaints from other spreadsheet people about this terrible problem; the closest match is this bug.  This is on Firefox 2.0.0.11/os2.  I've been tinkering with usercontent styles for textarea and such to try to find some workaround so I can see what I'm typing, but so far no luck.  Looking at Google's source code for spreadsheets doesn't really make it clear to me if they are really using a textarea or not, but that is what it looks and behaves like.  Here, this is a *major* disruption to functionality.

Comment 12

[Walter Gregg]

A workaround was posted as userstyles.org/styles/4354.  I'm fuzzy on what this CSS does, but entering it into userstyles makes spreadsheet editing possible again:

@-moz-document domain("spreadsheets.google.com") {
  .editBoxWrapper {
     overflow: -moz-scrollbars-none !important
  }
}

I would guess they made this domain-specific because it might have bad
side effects some places.  But it shouldn't be necessary anywhere;
Firefox should 'know' not to show a horizontal scrollbar on top of a 1-line textarea.
--
walt

Comment 13

[Tom Honermann]

FYI: This defect still exists with FireFox 3.0.5

Comment 14

[Alice0775 White]

Attachment: test case

The horizontal bar appears.
It depends on font and/or character.

Comment 15

[Alice0775 White]

In the test case of Comment #14 , 

The unexpected horizontal bar appears on Namoroka and Minefield.
Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.2pre) Gecko/20100112 Namoroka/3.6pre ID:20100112054604
Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.3a1pre) Gecko/20100112 Minefield/3.7a1pre ID:20100112050137

No unexpected horizontal bar appears on Shiretoko.
Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US; rv:1.9.1.8pre) Gecko/20100112 Firefox/3.5.8pre ID:20100112041747

Comment 16

[Alice0775 White]

In the test case of Comment #14 ,

For example,
Tools > Options > Content Fonts & Colers > Advanced
Select Founts for: "Central European"

Comment 17

[Emil Ivanov]

I cant see the horizontal scrollbar on Win7 with Firefox 3.6.13, the problem here is the missing scrollbar at all. See bug 292284, however the default textarea style have word-wrap:break-word, with word-wrap:normal the horizontal scrollbar appears.

Comment 18

[Tom Honermann]

This issue appears to no longer occur with FireFox 6.  Either no scroll bar appears at all, or the edit box is resizable.  Not displaying a scroll bar at all can be confusing and problematic as well, but that issue should be addressed via bug 292284. Since the original problem no longer occurs (scroll bars no longer obstruct the text), I'm changing status to Resolved/WorksForMe.