Example
Group related elements in a form:
<form>
<fieldset>
<legend>Personalia:</legend>
Name: <input type=”text”><br>
Email: <input type=”text”><br>
Date of birth: <input type=”text”>
</fieldset>
</form>
Definition and Usage
The <fieldset> tag is used to group related elements in a form.
The <fieldset> tag draws a box around the related elements.
Browser Support
| Element | |||||
|---|---|---|---|---|---|
| <fieldset> | Yes | Yes | Yes | Yes | Yes |
Tips and Notes
Tip: The <legend> tag defines a caption for the <fieldset> element.
Differences Between HTML 4.01 and HTML5
HTML5 has added new attributes for <fieldset>.
Attributes
= New in HTML5.
| Attribute | Value | Description |
|---|---|---|
| disabled | disabled | Specifies that a group of related form elements should be disabled |
| form | form_id | Specifies one or more forms the fieldset belongs to |
| name | text | Specifies a name for the fieldset |
Global Attributes
The <fieldset> tag also supports the Global Attributes in HTML.
Event Attributes
The <fieldset> tag also supports the Event Attributes in HTML.
Related Pages
HTML DOM reference: Fieldset Object
Default CSS Settings
Most browsers will display the <fieldset> element with the following default values:
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);
}
