All You Can Do with TextArea

All You Can Do With: TextArea

W3 Org on TextArea

Not showing in this AYCD page.

You will need a Name="SomeFormName" for your form to pass the data to your solution.
tabindex is available to control the tab order.(tabindex="5" {index order number}).
JavaScript
- onfocus
- onblur
- onselect
- onchange

Basic

<TEXtarea>Just a plain Vanilla way to do a text area.</textarea>

Size

<TEXtarea Rows="5" Cols="80">5 Rows and 80 columns of editable text area.</textarea>

Readonly

Readonly prevent this text from being editable.

<TEXtarea Rows="5" Cols="50" readonly>Readonly prevent this text from being editable.</textarea>

Disabled

<TEXtarea Rows="5" Cols="50" disabled>Disabled prevent this text from being editable and dims the text.</textarea>

Accesskey

<TEXtarea Rows="5" Cols="50" accesskey="T">Accesskey will take the user to this teatarea.</textarea>

Notes: On machines running MS Windows, press the "alt" key in addition to the access key. On Macintosh systems, press the "cmd" key in addition to the access key.

This is the CSS for TextArea.

Background Image

<TEXtarea Rows="5" Cols="50" style="background: url('images/box_aqua_bg.gif');">This textarea should have an image in the background.</textarea>

Color

<TEXtarea Rows="5" Cols="50" style="background-color: lightyellow;">This textarea has a 'lightyellow' background.</textarea>

Transparent

<TEXtarea Rows="5" Cols="50" style="background-color: Transparent;">This textarea has a 'transparent' background.</textarea>
Did this by adding a background image to the enclosing div tag.

Image Repeat-X

<TEXtarea Rows="5" Cols="50" style="background: url('images/box_aqua_bg.gif'); background-repeat: repeat-x">This textarea should have an image in the background that repeats in the "X" direction only.</textarea>

Image Repeat-Y

<TEXtarea Rows="5" Cols="50" style="background: url('images/box_aqua_bg.gif'); background-repeat: repeat-y">This textarea should have an image in the background that repeats in the "Y" direction only.</textarea>

Image no-repeat

<TEXtarea Rows="5" Cols="50" style="background: url('images/box_aqua_bg.gif'); background-repeat: no-repeat">This textarea should have an image in the background that does not repeat.</textarea>

Image Repeat

<TEXtarea Rows="5" Cols="50" style="background: url('images/box_aqua_bg.gif'); background-repeat: repeat">This textarea should have an image in the background that does repeat.</textarea>

Image Attachment Scroll

<TEXtarea Rows="5" Cols="50" style="background: url('images/box_aqua_bg.gif'); background-attachment: scroll">This textarea should have an image in the background that scrolls.</textarea>

Image Attachment Fixed

<TEXtarea Rows="5" Cols="50" style="background: url('images/box_aqua_bg.gif'); background-attachment: fixed">This textarea should have an image in the background that does not scrolls.</textarea>

Border Border Color

<TEXtarea Rows="5" Cols="50" style="border-color: lightgreen;">This textarea should have a 'lightgreen' border.</textarea>

These work too:

border-top-color
border-right-color
border-bottom-color
border-left-color

Border width

<TEXtarea Rows="5" Cols="50" style="border-width: 4px;">This textarea should have a 4px border.</textarea>

These work too:

border-top-width
border-right-width
border-bottom-width
border-left-width

Border style

<TEXtarea Rows="5" Cols="50" style="border-style: dotted;">This textarea should have a dotted border.</textarea>

Here are the options:

none
solid
hidden
dotted
dashed
double
groove
ridge
inset
outset

These work too:

border-top-style
border-right-style
border-bottom-style
border-left-style

Color Color: Text forground

<TEXtarea Rows="5" Cols="50" style="color: red;">This textarea should have red colored text.</textarea>

Cursor Cursor

<TEXtarea Rows="5" Cols="50" style="Cursor: crosshair;">This textarea should have crosshair cursor.</textarea>

Here are the options:

auto
crosshair
default
hand
pointer
move
n
ne
e
se
sw
w
nw-resize
text
wait
help
url(url)

Direction Direction

<TEXtarea Rows="5" Cols="50" style="direction: rtl;">This textarea should be Right To Left.</textarea>

Here are the options:

Right To Left=rtl
Left To Right=ltr

Display Display
CSS Display is being evealuated for implementation on this page.

Float Float- right
Example Static test that just runs on and on and repeats it-self until it can display the intended example. Example Static test that just runs on and on and repeats it-self until it can display the intended example. Example Static test that just runs on and on and repeats it-self until it can display the intended example.

<TEXtarea Rows="5" Cols="50" style="float: right;">This text should flow around the right of the textarea.</textarea>Example Static test that just runs on and on and repeats it-self until it can display the intended example.

Float- left
Example Static test that just runs on and on and repeats it-self until it can display the intended example. Example Static test that just runs on and on and repeats it-self until it can display the intended example. Example Static test that just runs on and on and repeats it-self until it can display the intended example.

<TEXtarea Rows="5" Cols="50" style="float: left;">This text should flow around the left of the textarea.</textarea>Example Static test that just runs on and on and repeats it-self until it can display the intended example.

Float- none
Example Static test that just runs on and on and repeats it-self until it can display the intended example. Example Static test that just runs on and on and repeats it-self until it can display the intended example. Example Static test that just runs on and on and repeats it-self until it can display the intended example.

<TEXtarea Rows="5" Cols="50" style="float: none;">This text should not flow around the left or right of the textarea.</textarea>Example Static test that just runs on and on and repeats it-self until it can display the intended example.

Font Font-bold
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: bold;">This text should show the font style.</textarea>

Font-italic
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: italic;">This text should show the font style.</textarea>

Font-oblique
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: oblique;">This text should show the font style.</textarea>

Font-small-caps
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: small-caps;">This text should show the font style.</textarea>

Font-caption
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: caption;">This text should show the font style.</textarea>

Font-icon
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: icon;">This text should show the font style.</textarea>

Font-menu
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: menu;">This text should show the font style.</textarea>

Font-message-box
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: message-box;">This text should show the font style.</textarea>

Font-small-caption
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: small-caption;">This text should show the font style.</textarea>

Font-status-bar
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: status-bar;">This text should show the font style.</textarea>

Font-(size 9pt)
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: 9pt;">This text should show the font size.</textarea>

Font-(size 14pt)
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: 14pt;">This text should show the font size.</textarea>

Here are the options: Number limits are different for every Browser.

Font-(size/hight 10pt/20pt)
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: 10pt/20pt;">This text should show the font size/hight.</textarea>

Font-(size/hight 14pt/28pt)
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: 14pt/28pt;">This text should show the font size/hight.</textarea>

Here are the options: Number limits are different for every Browser.

Font-(famliy Arial)
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: Arial;">This text should show the font famliy.</textarea>

Font-(famliy Helvetica)
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: Helvetica;">This text should show the font famliy.</textarea>

Font-(famliy Times)
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font: Times;">This text should show the font famliy.</textarea>

Font-Family Font-Family Times
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font-family: Times;">This text should show the font family.</textarea>

Here are some options:

Verdana
Arial
Helvetica
sans-serif

Font-Family Font-Size
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font-size: large;">This text should show the font size.</textarea>

Here are the options:

larger
smaller
xx-small
x-small
small
medium
large
x-large
xx-large
Number in points (10pt, 12pt, 14pt, 18pt, etc;)

Font-Stretch Font-Stretch
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font-stretch: ultra-condensed;">This text should show the font stretch.</textarea>

Here are the options:

wider
narrower
ultra-condensed
extra-condensed
condensed
semi-condensed
normal
semi-expanded
expanded
extra-expanded
ultra-expanded

Font-Style Font-Style
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font-style: normal;">This text should show the font style.</textarea>

Here are the options:

italic
oblique

Font-Variant Font-Variant
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font-variant: small-caps;">This text should show the font variant.</textarea>

Here are the options:

normal

Font-Weight Font-Weight
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font-weight: 700;">This text should show the font weight.</textarea>

Here are the options:

normal
bold
lighter
bolder
100-500 - normal
600
700-800
900

Font-Height Font-Height
Font Example:

Font Example: <TEXtarea Rows="5" Cols="50" style="font-height: 24px;">This text should show the font height.</textarea>

Here are the options:

auto

Letter Spacing Letter-Spacing (Kerning)
Letter Spacing Example:

Letter Spacing Example: <TEXtarea Rows="5" Cols="50" style="letter-spacing: 10px;">This text should show the letter-spacing.</textarea>

Here are the options:

normal
-Xpx
+Xpx

Line Height Line-Height (leading)
Line Height Example:

Line Height Example: <TEXtarea Rows="5" Cols="50" style="line-height: 20px;">This text should show the letter-spacing.</textarea>

Here are the options:

normal
Xpx

Margin Margin
Margin Example:

Margin Example: <TEXtarea Rows="5" Cols="50" style="margin-top: 20px;">This textarea should show the margin-top.</textarea>

Here are the options:

margin-top: auto/Xpx;
margin-right auto/Xpx;
margin-bottom auto/Xpx;
margin-left auto/Xpx;

Overflow overflow
overflow Example:

overflow Example: <TEXtarea style="overflow: hidden;">This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.</textarea>

overflow Example:

overflow Example: <TEXtarea Cols="50" style="overflow: visible;">This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.</textarea>

overflow Example:

overflow Example: <TEXtarea style="overflow: scroll;">This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.This text should show the overflow as hidden.</textarea>

Here are the options:

hidden
scroll
visible
auto

Padding padding
padding Example:

padding Example: <TEXtarea style="padding: 12px;" Rows="5" Cols="80"">This text should show the padding as 12px.</textarea>

Here are the options:

padding-top
padding-right
padding-bottom
padding-left

Position position
position Example:

position:absolute Example: <TEXtarea style="position: relative; top:-50; left:5" Rows="5" Cols="80"">This text should show the position as -50 px or up 50 and 5 left.</textarea>

Here are the options:

position:absolute
position:relative
position:fixed
top
left
z-index

Scrollbar scrollbar
Scrollbar 3D Light Color Example:

Scrollbar 3D Light Color Example: <TEXtarea style="scrollbar-3dlight-color:red" Rows="5" Cols="80"">This text should show the scrollbar-3dlight-color:red. Repeating to display a scrollbar.This text should show the scrollbar-3dlight-color:red. Repeating to display a scrollbar.This text should show the scrollbar-3dlight-color:red. Repeating to display a scrollbar.This text should show the scrollbar-3dlight-color:red. Repeating to display a scrollbar.This text should show the scrollbar-3dlight-color:red. Repeating to display a scrollbar.This text should show the scrollbar-3dlight-color:red. Repeating to display a scrollbar.</textarea>

Scrollbar Arrow Color Example:

Scrollbar Arrow Light Color Example: <TEXtarea style="scrollbar-arrow-color:blue" Rows="5" Cols="80"">This text should show the scrollbar-arrow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-arrow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-arrow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-arrow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-arrow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-arrow-color:blue. Repeating to display a scrollbar.</textarea>

Scrollbar Base Color Example:

Scrollbar Base Light Color Example: <TEXtarea style="scrollbar-base-color:blue" Rows="5" Cols="80"">This text should show the scrollbar-base-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-base-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-base-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-base-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-base-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-base-color:blue. Repeating to display a scrollbar.</textarea>

Scrollbar darkshadow Color Example:

Scrollbar darkshadow Light Color Example: <TEXtarea style="scrollbar-darkshadow-color:blue" Rows="5" Cols="80"">This text should show the scrollbar-darkshadow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-darkshadow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-darkshadow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-darkshadow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-darkshadow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-darkshadow-color:blue. Repeating to display a scrollbar.</textarea>

Scrollbar Face Color Example:

Scrollbar Face Light Color Example: <TEXtarea style="scrollbar-face-color:blue" Rows="5" Cols="80"">This text should show the scrollbar-face-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-face-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-face-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-face-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-face-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-face-color:blue. Repeating to display a scrollbar.</textarea>

Scrollbar Highlight Color Example:

Scrollbar Highlight Light Color Example: <TEXtarea style="scrollbar-highlight-color:blue" Rows="5" Cols="80"">This text should show the scrollbar-highlight-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-highlight-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-highlight-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-highlight-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-highlight-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-highlight-color:blue. Repeating to display a scrollbar.</textarea>

Scrollbar Shadow Color Example:

Scrollbar Shadow Light Color Example: <TEXtarea style="scrollbar-shadow-color:blue" Rows="5" Cols="80"">This text should show the scrollbar-shadow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-shadow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-shadow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-shadow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-shadow-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-shadow-color:blue. Repeating to display a scrollbar.</textarea>

Scrollbar Track Color Example:

Scrollbar Track Light Color Example: <TEXtarea style="scrollbar-track-color:blue" Rows="5" Cols="80"">This text should show the scrollbar-track-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-track-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-track-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-track-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-track-color:blue. Repeating to display a scrollbar.This text should show the scrollbar-track-color:blue. Repeating to display a scrollbar.</textarea>

Here are the options:

scrollbar-3dlight-color:ColorX
scrollbar-arrow-color:ColorX
scrollbar-Base-Color:ColorX
scrollbar-DarkShadow-Color:ColorX
scrollbar-Face-Color:ColorX
scrollbar-Highlight-Color:ColorX
scrollbar-Shadow-Color:ColorX
scrollbar-Track-Color:ColorX

Text Align text align
Text Align Example:

Text Align Example: <TEXtarea style="text-align: right" Rows="5" Cols="80"">This text should show the text-align: right.</textarea>

Text Align Example:

Text Align Example: <TEXtarea style="text-align: center" Rows="5" Cols="80"">This text should show the text-align: center.</textarea>

Text Align Example:

Text Align Example: <TEXtarea style="text-align: justify" Rows="5" Cols="80"">This text should show the text-align: justify.</textarea>

Here are the options:

text-align: left
text-align: center
text-align: right
text-align: justify

Text Decoration text decoration
Text Decoration Example:

Text Decoration Example: <TEXtarea style="text-decoration: line-through" Rows="5" Cols="80"">This text should show the text-decoration: line-through.</textarea>

Text Decoration Example:

Text Decoration Example: <TEXtarea style="text-decoration: underline" Rows="5" Cols="80"">This text should show the text-decoration: underline.</textarea>

Text Decoration Example:

Text Decoration Example: <TEXtarea style="text-decoration: blink" Rows="5" Cols="80"">This text should show the text-decoration: blink.</textarea>

Here are the options:

text-decoration: none
text-decoration: overline
text-decoration: line-through
text-decoration: underline
text-decoration: blink

Text Indent text indent
Text Indent Example:

Text Indent Example: <TEXtarea style="text-indent: 100px;" Rows="5" Cols="80"">This text should show the text-indent: 100px.</textarea>

Here are the options:

text-indent: #px

Text Justify text justify
Text Justify Example:

Text Justify Example: <TEXtarea style="text-justify: newspaper;" Rows="5" Cols="80"">This text should show the text-justify: newspaper.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.Repeat for the style to work.</textarea>

Here are the options:

text-justify: auto;
text-justify: distribute;
text-justify: distribute-all-lines;
text-justify: inter-cluster;
text-justify: inter-ideograph;
text-justify: inter-word;
text-justify: kashda;
text-justify: newspaper;

Text Shadow text shadow
Text Shadow Example:

Text Shadow Example: <TEXtarea style="text-shadow: blue;" Rows="5" Cols="80"">This text should show the text-shadow: blue.</textarea>

Here are the options:

text-shadow:

Text Transform text transform
Text Transform Example:

Text Transform Example: <TEXtarea style="text-transform: uppercase;" Rows="5" Cols="80"">This text should show the text-transform: uppercase.</textarea>

Here are the options:

text-transform: capitalize;
text-transform: uppercase;
text-transform: lowercase;
text-transform: none;

Text Underline Position text underline position
Text Underline Position Example:

Text Underline Position Example: <TEXtarea style="text-underline-position: above;" Rows="5" Cols="80"">This text should show the text-underline-position: above.</textarea>

Here are the options:

text-underline-position: above;
text-underline-position: below;

Vertical Align vertical align
Vertical Align Example:

Vertical Align Example: <TEXtarea style="vertical-align: top;" Rows="5" Cols="80"">This text should show the vertical-align: top.</textarea>

Vertical Align Example:

Vertical Align Example: <TEXtarea style="vertical-align: middle;" Rows="5" Cols="80"">This text should show the vertical-align: middle.</textarea>

Vertical Align Example:

Vertical Align Example: <TEXtarea style="vertical-align: bottom;" Rows="5" Cols="80"">This text should show the vertical-align: bottom.</textarea>

Here are the options:

vertical-align: top;
vertical-align: middle;
vertical-align: baseline;
vertical-align: bottom;
vertical-align: sub;
vertical-align: super;
vertical-align: text-bottom;
vertical-align: text-top;

Visibility visibility
Visibility Example:

Visibility Example: <TEXtarea style="visibility: hidden;" Rows="5" Cols="80"">This text should show the visibility: hidden.</textarea>

Here are the options:

visibility: hidden;
visibility: visible;
visibility: collapse;

White Space white space
White Space Example:

White Space Example: <TEXtarea style="white-space: nowrap;" Rows="5" Cols="80"">This text should show the white-space: nowrap. Repeat text to show nowrap. Repeat text to show nowrap. Repeat text to show nowrap. Repeat text to show nowrap. Repeat text to show nowrap. Repeat text to show nowrap. Repeat text to show nowrap.</textarea>

Here are the options:

white-space: normal;
white-space: nowrap;
white-space: pre;

Word Spacing word spacing
Word Spacing Example:

Word Spacing Example: <TEXtarea style="word-spacing: -5px;" Rows="5" Cols="80"">This text should show the word-spacing: -5px.</textarea>

Here are the options:

word-spacing: normal;
word-spacing: #px;
word-spacing: -#px;

Word Wrap word wrap
Word Wrap Example:

Word Wrap Example: <TEXtarea style="word-wrap: break-word;" Rows="5" Cols="80"">This text should show the word-wrap: break-word. Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword</textarea>

Word Wrap Example:

Word Wrap Example: <TEXtarea style="word-wrap: normal;" Rows="5" Cols="80"">This text should show the word-wrap: normal. Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword Toshowwraphereisareallyreallylongword</textarea>

Here are the options:

word-wrap: break-word;
word-wrap: normal;

Zoom zoom
Zoom Example:

Zoom Example: <TEXtarea style="zoom: 50%;" Rows="5" Cols="80"">This text should show the zoom: 50%.</textarea>

Here are the options:

zoom: 50%;