HTML Fieldset and Legend Tags
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?
Explanation
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 :
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 :
Result :
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.
Feedback form
Note: Fieldset encloses content between <td> and </td>, so it doesnt work for forms defined by multiple rows and columns.
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 :
<fieldset>
<legend>Details</legend>
Name <input type="text" size="10" />
Age <input type="text" size="3" />
</fieldset>
Result : <legend>Details</legend>
Name <input type="text" size="10" />
Age <input type="text" size="3" />
</fieldset>
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 :
<fieldset style="width:220" align="center"> <legend>Details</legend> Name <input type="text" size="10" /> Age <input type="text" size="3" /> </fieldset>
Result :
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.
Feedback form
Note: Fieldset encloses content between <td> and </td>, so it doesnt work for forms defined by multiple rows and columns.
