HTML fieldset Tag

HTML <fieldset> tag is used to group related HTML elements in a single box, by drawing a bordered box around the grouped elements.

This is mostly used when we create a form on webpage. Grouping the related fields in a form displays the form fields in a more organized manner.

Suppose there is a form that is used for user registration as well as for the login process. Using the <fieldset> tag, we can group the fields used for the login process and the user registration process in two separate boxes, which will make it super easy for the end user to know which form fields are for login and which are for registration.

This is a block-level element.

HTML <fieldset> Tag - Syntax and Usage

The <fieldset> element requires the start(opening) tag and end(closing) tag.

Given below is the required syntax for the same:

<fieldset>
    some content or form fields
</fieldset>

It is not necessary that we use the <fieldset> tag with form fields only. We can use it anywhere, where a grouping is required to show a set of information as one.

Using <legend> tag to provide heading

We can also use the <legend> tag just after the opening <fieldset> tag to provide a heading for the grouping. For example, to group the login form fields, we can provide the text Login within the <legend> tag and this text appers on the border.

?<fieldset>
    <legend>Title Text</legend>
    some content or form fields
</fieldset>

HTML <fieldset> Tag Basic Example

Below we have a basic example for <fieldset> tag, where we have also used the <legend> tag:

HTML <fieldset> Tag Attributes

This element supports Global attributes and Event attributes, along with a few specific attributes given below:

Default CSS style for HTML <fieldset> Tag

fieldset {
    display: block;
    margin-left: 2px;
    margin-right: 2px;
    padding-top: 0.35em;
    padding-bottom: 0.625em;
    padding-left: 0.75em;
    padding-right: 0.75em;
    border: 2px groove (internal value);
}

Browser Support for HTML <fieldset> tag

Following browsers support this attribute:

• Firefox 1+

• Google Chrome 1+

• Internet Explorer 4+

• Safari 1+

• Opera 4+