HTML fieldset: Main Tips
- The
<fieldset>
in HTML groups elements inside a <form> element. - The <legend> element adds a caption for the
<fieldset>
element. You need to place it inside the HTML<fieldset>
element.
Use of fieldset
The HTML <fieldset>
tag groups <form>
elements. Normally, a box border is drawn around them.
Example
<form action="login" method="POST">
<fieldset>
<legend>Login Form:</legend>
Username: <input type="text" name="user_name">
Password: <input type="password" name="user_password">
<input type="submit" value="Login">
</fieldset>
</form>
Note: the box border provides some space for captions and creates better visual appearance for the grouped elements.

Pros Main Features
- Simplistic design (no unnecessary information)
- High-quality courses (even the free ones)
- Variety of features
- Nanodegree programs
- Suitable for enterprises
- Paid certificates of completion

Pros Main Features
- Professional service
- Flexible timetables
- A variety of features to choose from
- Professional certificates of completion
- University-level courses
- Multiple Online degree programs

Pros Main Features
- Great user experience
- Offers quality content
- Very transparent with their pricing
- Free certificates of completion
- Focused on data science skills
- Flexible learning timetable
Attributes for fieldset
disabled
The disabled
attribute turns off all the elements inside the <fieldset>
element.
Example
<form action="login" method="POST">
<fieldset disabled>
<legend>Login Form:</legend>
Username: <input type="text" name="user_name">
Password: <input type="password" name="user_password">
<input type="submit" value="Login">
</fieldset>
</form>
form
The form
attribute gets the values of the ID attributes of a <form>
element, which will be a part of the <fieldset>
in HTML.
Example
<form action="login" method="POST" id="user_form">
<fieldset>
<legend>Login Form:</legend>
Username: <input type="text" name="user_name">
Password: <input type="password" name="user_password">
<input type="submit" value="Login">
</fieldset>
</form>
<fieldset form="user_form">
<legend>Other Details:</legend>
Email ID: <input type="text" name="user_email">
Phone Number: <input type="text" name="user_number">
</fieldset>
name
It defines the name for the grouped elements.
Example
<form action="login" method="POST" id="user_form">
<fieldset name="login_form">
<legend>Login Form:</legend>
Username: <input type="text" name="user_name">
Password: <input type="password" name="user_password">
<input type="submit" value="Login">
</fieldset>
</form>
Browser support

Chrome
All

Edge
All

Firefox
All

IE
All

Opera
All

Safari
All
Mobile browser support

Chrome
All

Firefox
All

Opera
All

Safari
All
Latest Udacity Coupon Found:
Verified STAFF PICK
75% OFF COURSES
Udacity Black Friday Offer
The best time to save on Udacity courses is now - follow this coupon to access a 75% Udacity Black Friday discount & enjoy learning at a very low cost!
Expiration date: 27/02/2021
3176 People Used
Only 97 Left