legend (HTML element)
| Depr. | Empty | Version |
|---|---|---|
| No | No | HTML 4 |
| IE5.5+ | FF1+ | Saf1.3+ | Op9.2+ |
|---|---|---|---|
| Full | Full | Full | Full |
Example
This
legend element identifies three related XFN attributes
(the online reference has more on
XFN):
<form>
<fieldset>
<legend>Friendship</legend>
<input type="radio" name="radFriendship" value="Not_Applicable"
id="radFriendNot_Applicable"/>
<label for="radFriendNot_Applicable">Not_Applicable</label>
<input type="radio" name="radFriendship" value="acquaintance"
id="radFriendaquaintence"/>
<label for="radFriendaquaintence">acquaintance</label>
<input type="radio" name="radFriendship" value="friend"
id="radFriendfriend"/>
<label for="radFriendfriend">friend</label>
</fieldset>
⋮
</form>
- Type
- inline element
- Contains
- inline elements only
- Contained by
- fieldset
Description
The legend is used to provide the caption
text for grouped form controls and text contained in a fieldset. By default, the text appears on the
left, over the boxed outline that the fieldset creates, as Figure 1 shows (the word “Friendship” is the
content). No other content may appear between the opening
<fieldset> tag and the opening
<legend> tag—only whitespace is allowed.
Use This For …
Use
this element to give a name to the grouped form elements. There are no hard rules about
what goes inside the <legend> and
</legend> tags, but take care: some browsers have a hard
time applying styles to the legend, so it’s good
practice to keep the text content as succinct as possible, in order to
avoid styling problems. Another reason to keep the text short is that this
is best for screen reader users who may have to listen to the announcement
of the legend text before every form input inside the
fieldset related to the
legend.
Compatibility
| IE | 5.5 | Full |
|---|---|---|
| 6.0 | Full | |
| 7.0 | Full | |
| Firefox | 1.0 | Full |
| 1.5 | Full | |
| 2.0 | Full | |
| Safari | 1.3 | Full |
| 2.0 | Full | |
| 3.0 | Full | |
| Opera | 9.2 | Full |
| 9.5 | Full |
It causes no compatibility issues, and has excellent support across all tested browsers.
User-contributed notes
- ID:
- #1
- Date:
- Fri, 28 Mar 2008 11:31:04 GMT
Opera has an oddity in that the default horizontal position of the LEGEND depends on the left padding of the FIELDSET.
Add a note
To post a note on this topic, please log in with your SitePoint username and password. If you don't have an account yet, you can create a new account for free.
