Topic: How to draw outline or boxes around the elements in the html
page using fieldset? How Legend tag is used as a caption for html page
elements?
HTML Fieldset and Legend Tag:
Fieldset is an element used for drawing an outline or boxes around the field elements in the html page. Legend tag is used as a caption for fieldset element.
Example Code:
Fieldset is an element used for drawing an outline or boxes around the field elements in the html page. Legend tag is used as a caption for fieldset element.
Example Code:
<fieldset>
<legend>Details</legend>
Name <input type="text"
size="10" />
Age <input type="text"
size="3" />
</fieldset>
Result:
DetailsName Age
This example shows drawing an outline box with "Details" as caption using legend tag. Size of the outline box can be adjusted by resizing the width.
Example Code:
<fieldset
style="width:220" align="center">
<legend>Details</legend>
Name <input type="text"
size="10" />
Age <input type="text"
size="3" />
</fieldset>
Result:
DetailsName Age
Mostly, these tags are used in lengthy forms to give the webpage a good look. Here is an example where these tags are used in feedback form.
Note: Fieldset encloses content between <td> and </td>, so it doesnt work for forms defined by multiple rows and columns.