BrianK
BrianK

Reputation: 2705

Firefox won't show scrollbars for 2 row textarea

Firefox will not show a scrollbar in a 2 line textarea if I set the height so that only two rows are actually displayed. I have to make it big enough to show part of the line below. Anybody worked around this?

I created a jsfiddle: http://jsfiddle.net/briank/ATFdE/6/

<textarea rows="2" style="width: 200px; height: 30px; overflow:auto">
This is some text. see if it shows scrollbars
1
2
3 
</textarea>

Upvotes: 1

Views: 528

Answers (3)

Mike Ratcliffe
Mike Ratcliffe

Reputation: 1025

Chrome handles this well so I have added the testcase to an existing bug here.

Upvotes: 0

Niels Keurentjes
Niels Keurentjes

Reputation: 41958

There is no workaround possible, you're simply trying to fit an elephant in a tea cup. Below a given threshold, somewhere around 35 pixels depending on system and browser, there just isn't room anymore for an identifiable scrollbar. Firefox decides to hide it instead, Chrome just removes the scroll thumb - both mean it's not usable.

To make it appear, actually give it enough height to have one.

On a semi-related note, you can set resize:none in CSS to make a textarea element have static size instead of the resizable corner in the bottom right. This also gives it slightly more room to fit a scrollbar, but in normal situations there's still not enough room at a height of just 30 pixels.

Upvotes: 1

mayaa
mayaa

Reputation: 173

In firefox, even you set height for textarea manually, the textarea can still be changing height by click and drag the corner. Actually there is a symbol around the corner indicates such changing height ability. So you don't have to worry about it. Maybe set a bigger height for it is better.

Upvotes: 0

Related Questions