Hiding vertical scrollbar in multi-line textbox in IE

Question

I have a multiline textbox :

<asp:TextBox ID="txtBody" runat="server"  TextMode="MultiLine" Rows="10" Width="95%" />

In ie there is a vertical scrollbar bar even if a text inside textbox doesn't occupy 10 lines.
In firefox it does not happen, scroll bar appears only if text exceeds 10 lines.

What can be done?

Answer 1

Set CSS style overflow to auto:

<asp:TextBox ID="txtBody" runat="server" TextMode="MultiLine"
             Rows="10" Width="95%" style="overflow:auto;" />

The default behavior differs between browsers, which is why you see different behavior in IE and FF when overflow is not specified.

To override default browser behaviour for all multiline textboxes on your page, you can add it in a style definition. Then you don't need to include the inline style on each textbox:

^{Note: Multiline TextBox is rendered using HTML tag <textarea>, so we will specify the css style for the textarea element type.}

textarea {
  overflow: auto;
}

<textarea id="txtBody1" rows="5">Text in 
textbox 
with 
many 
lines, 
so that
scrollbar 
will 
appear.
</textarea>
<textarea id="txtBody2" rows="5">Smaller text, no scrollbar.</textarea>

Answer 2

It is the default behavior of IE. The default value of overflow is visible and IE adds a disabled scroll bar even if the content does not overflow.

You can add a css class to the element

<style>
    .Over { overflow: auto; width: 95%; }
</style>

<asp:TextBox ID="txtBody" runat="server" CssClass="Over" TextMode="MultiLine" Rows="10" />