In this article, you learn how to code an html textarea element and how to control the text in a textarea, along with an introduction into using CSS, Java Script, and server-side programming with an html textarea element.
Welcome to Bucaro TecHelp!

Bucaro TecHelp
Maintain Your Computer and Use it More Effectively
to Design a Web Site and Make Money on the Web

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact RSS News Feeds News Feeds

Victims of Sandy Hook

Stop the Slaughter of Innocents. Congress is bought and paid for by gun lunatics and gun promotion groups. If you want to live in a safe America, help buy Congress back for America. Send a donation to Mayors Against Illegal Guns, 909 Third Avenue, 15th Floor New York, NY 10022

HTML Textarea Basics

A textarea is an html element used to create a multicolumn text input box. Shown below is the code for a basic textarea.

<textarea cols="32" rows="4"></textarea>

Note the attributes cols and rows. These attributes are basically used to set the size of the textarea.

cols sets the width of the text area based on the current font size
rows sets the height of the text area based on the current font size

Normally, you would want to put a label to indicate what kind of information should be typed into the textarea. You could simply put the label above the textarea as shown below.

<p>Comments:<br />
<textarea cols="32" rows="4"></textarea></p>

Comments:

Or, you could put the label to the left of the text area as shown below.

Comments:

To accomplish this you could place the label text and the textarea within the cells of a table and then set the valign attribute of the first cell to top. The code for this is shown below.

<table><tr><td valign="top">Comments:</td><td>
<textarea cols="32" rows="4"></textarea>
</td></tr></table>

You could also use an html <label> element put the label as shown below.

<label for="ta1">Comments:</label><br />
<textarea id="ta1"></textarea>

If you use the html <label> element and set it's for attribute to the same value as the textarea's id attribute, then clicking on the label produces the same result as clicking on the textarea, e.g. the textarea receives the focus.

RSS Feed RSS Feed


Follow Stephen Bucaro Follow @Stephen Bucaro


Web Design Sections

Fire HD
[Site User Agreement] [Privacy Policy] [Site map] [Search This Site] [Contact Form]
Copyright©2001-2016 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268