Wrap two inputs in a fieldset.
Acceptance criteria
- 1.Wrap two inputs in a fieldset.
HTML Tutorial · HTML Tags
These 10 tasks go with the HTML <fieldset> Tag chapter. 5 of them ask you to build something small from scratch; 5 give you code that is already broken and ask you to work out why. Set aside about 90 minutes for the whole set, though you can do them in any order.
Nothing here is marked by a person. When you press Submit, the editor checks your code against the points listed under each task and tells you straight away what passed and what didn't (you need a free account to submit). If you get stuck, there are hints, and a worked solution once you've had a go. The first 2 tasks are free; the rest are part of the practice plan.
If it's been a while since you read the chapter, here is how it starts: “The tag is used to group related elements in a form . It helps organize form controls visually and semantically, often improving usability and accessibility . It is usually combined with the tag to provide a caption for the grouped fields.” .
1.Group related fieldsexercise · easy · 10 min
Wrap two inputs in a fieldset.
Passes when: Wrap two inputs in a fieldset.
2.Name the groupexercise · easy · 10 min · practice plan
Give the fieldset a legend.
Passes when: Give the fieldset a legend.
3.Group radio buttonsexercise · easy · 10 min · practice plan
Put two radio buttons in a labelled fieldset.
Passes when: Put two radio buttons in a labelled fieldset.
4.Disable a whole groupexercise · easy · 10 min · practice plan
Disable every field at once with the fieldset.
Passes when: Disable every field at once with the fieldset.
5.A grouped form sectionexercise · medium · 10 min · practice plan
Build a form with one legended fieldset holding two fields.
Passes when: Build a form with one legended fieldset holding two fields.
6.Fix the div used to group fieldsbug fix · easy · 8 min
Related controls belong in a fieldset.
Passes when: Related controls belong in a fieldset.
7.Fix the heading used as a group namebug fix · easy · 8 min · practice plan
A fieldset is named with a legend.
Passes when: A fieldset is named with a legend.
8.Fix the radios with different namesbug fix · easy · 8 min · practice plan
Radios only work as a group when they share a name.
Passes when: Radios only work as a group when they share a name.
9.Fix each field disabled one by onebug fix · easy · 8 min · practice plan
The fieldset can disable the whole group.
Passes when: The fieldset can disable the whole group.
10.Fix the legend outside the fieldsetbug fix · easy · 8 min · practice plan
The legend must be the fieldset's first child.
Passes when: The legend must be the fieldset's first child.
Between them these tasks cover Grouping fields, legend and Related inputs.
Looking for a different chapter? See every practice set, or switch to the interview theory questions.