HTML wrap Attribute

Description

The HTML wrap attribute is used within the <textarea> element to define how text should be wrapped within the text input area when the user enters more text than can be displayed horizontally. It is a boolean attribute, meaning it does not require a value; simply including it in the <textarea> tag is sufficient to activate it.

Here's an example of how the wrap attribute can be used within a <textarea> element:

<textarea wrap="hard">
  This is a long line of text that will wrap according to the boundaries of the text input area.
</textarea>

In this example, the text will be hard wrapped, meaning line breaks will be inserted automatically within the input area when the text reaches its boundary.

Syntax

<textarea wrap="soft | hard | off">

Values

softThis is the default behavior if the wrap attribute is not specified. Text entered in the textarea is visually wrapped to the next line within the textarea box, but the entered text is submitted without any line breaks or wrapping. This means that the text is treated as a single long line unless the user manually enters line breaks.
hardWith this setting, the text is visually wrapped in the textarea similarly to the soft value, but it also inserts hard line breaks in the submitted data according to the wrapping in the textarea. This is useful when the server-side processing expects the text input to contain specific line breaks, such as for formatting plain text emails or code blocks.
offThis setting disables automatic wrapping of text entirely, allowing text to continue in a single line within the textarea. This might result in horizontal scrolling within the textarea if the text exceeds the visible width of the box. The text is submitted without line breaks, similar to the soft setting.

Applies To

The wrap attribute can be used on the following html elements.

<textarea>

Example

HTML

<form action="formscript.php" method="get">

  <label for="comment">Comment:</label><br>

  <textarea id="comment" name="comment" rows="4" cols="50" wrap="hard">

This is an example of how text is prefilled in a textarea. Notice how the text wraps according to the cols attribute, and because the wrap attribute is set to "hard", these line breaks will be preserved when the form is submitted.

  </textarea><br>

  <input type="submit" value="Submit">

</form>

Result

Editor