Grow your CSS skills. Land your dream job.

Last updated on:

Remove Scrollbar from Textarea in IE

By default all versions of IE have a scrollbar on textareas, even when they are empty.

No other browsers do this, so if you want to remove it so IE can visually match other browsers, just:

textarea { overflow: auto; }

The scrollbar will return (rightfully) when the text in the textarea expands beyond it's bounds.

Comments

  1. CJBNZ
    Permalink to comment#

    Thanks! Always wondered how you could do that!

  2. pampalini
    Permalink to comment#

    thanks, it’s fine but the Opera?

  3. Thank you for this cool tip. can use it at many places.

  4. Boe Jill
    Permalink to comment#

    Excellent tip, but as Mr Pampalini asked, how can we make this work in Opera?

  5. Very useful tip. many webmaster would be wait to know how to remove the scroll bar from textarea.
    Thanks once again.

  6. I am in need of this hack (for me it’s hack) as i found lot for removing scrollbar from textarea in IE7. Thanks for this post.

  7. pampalini
    Permalink to comment#

    sorry, it works on Opera too, but only from version 10.51! ;)

  8. kiko

    The same problem with older versions of Opera, any way to fix?

  9. Panos I. Papadopoulos
    Permalink to comment#

    Thanks for the simple and right answer! It’s just what I looked for!

  10. Permalink to comment#

    Thanks. Solved my issue in 1 minute :)

  11. saravanan
    Permalink to comment#

    useful tip

  12. Noel
    Permalink to comment#

    Thanks for that – have checked this in IE 5.5, 6, 7 and 8 and works exactly as described (I’ve seen a few forum posts suggesting that overflow: hidden could be used but that didn’t seem like the right way to approach the problem). This also works correctly if you’re using a dynamic-width textarea (columns value set inline in the tag itself and width value in stylesheet overriding it).

  13. Uma
    Permalink to comment#

    Thank you very much. Really it is very helpful to me.

  14. Nice tip. This is exactly what I’m looking for. Thank you for sharing.

  15. Keiron Lowe
    Permalink to comment#

    Hi Chris,

    Hope you could help, I’m using this on a site I am developing but I have found that in IE7 and IE6 it removes the scrollbar, but keeps the space where the scrollbar used to be. Resulting in them two browsers having a wider textarea.

    It’s driving me nuts!

  16. Andrey
    Permalink to comment#

    Cool! Thanks a lot!

  17. short and simple, 10x

  18. Hamlet
    Permalink to comment#

    Thankx!

  19. Permalink to comment#

    if seems like the space of the scroller remains as the scroller disappears. this is not a good solution. this happens in ie7 btw.regards

  20. AT
    Permalink to comment#

    thanx! this thing was very useful for me

  21. Permalink to comment#

    Thanks Chris, IE is soooooo evil

  22. epiziv
    Permalink to comment#

    thanks A lot…….!!!!!!!!!!!

  23. small but so useful snippet !! Thanks !! saved a day !!

  24. textarea {
    resize: none;
    }

    enjoy!

    :-)

  25. saif
    Permalink to comment#

    awesm trick… i was stuck
    thanks…. :)

  26. Gouthami
    Permalink to comment#

    Very nice tip thank you

  27. Thanks :)

  28. Ahmed
    Permalink to comment#

    This site is the best site that teach CSS thank you!!

  29. alin
    Permalink to comment#

    It’s really works! Thanks

Leave a Comment

Posting Code

Markdown is supported in the comment area, so you can write inline code in backticks like `this` or multiline blocks of code in in triple backtick fences like ```this```. You don't need to escape code in backticks, Markdown does that for you.

Sadly, it's kind of broken. WordPress only accepts a subset of HTML in comments, which makes sense, because certainly some HTML can't be allowed, like <script> tags. But this stripping happens before the comment is processed by Markdown (via Jetpack). It seems to me that would be reversed, because after Markdown processes code in backticks, it's escaped, thus safe. If you think you can fix this issue, get in touch!

If you need to make sure the code (typically HTML) you post absolutely posts correctly, escape it and put it within <pre><code> tags.

Current ye@r *

*May or may not contain any actual "CSS" or "Tricks".