2021-10-14 23:33:13 +01:00 
										
									 
								 
							 
							
								
							 
							
								 
							 
							
							
								---
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								id: 60fad0a812d9890938524f50
							 
						 
					
						
							
								
									
										
										
										
											2021-10-21 10:07:52 -07:00 
										
									 
								 
							 
							
								
									
										 
									 
								
							 
							
								 
							 
							
							
								title: Step 35
							 
						 
					
						
							
								
									
										
										
										
											2021-10-14 23:33:13 +01:00 
										
									 
								 
							 
							
								
							 
							
								 
							 
							
							
								challengeType: 0
							 
						 
					
						
							
								
									
										
										
										
											2021-10-21 10:07:52 -07:00 
										
									 
								 
							 
							
								
									
										 
									 
								
							 
							
								 
							 
							
							
								dashedName: step-35
							 
						 
					
						
							
								
									
										
										
										
											2021-10-14 23:33:13 +01:00 
										
									 
								 
							 
							
								
							 
							
								 
							 
							
							
								---
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								# --description--
 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								To give Campers an idea of what to put in their bio, the `placeholder`  attribute is used. The `placeholder`  accepts a text value, which is displayed until the user starts typing.
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								Give the `textarea`  a `placeholder`  of `I like coding on the beach...` .
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								# --hints--
 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								You should give the `textarea`  a `placeholder`  attribute.
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								```js
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								assert.isNotEmpty(document.querySelector('fieldset:nth-child(3) > label:nth-child(4) > textarea')?.placeholder);
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								```
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								You should give the `placeholder`  a value of `I like coding on the beach...` .
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								```js
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								assert.equal(document.querySelector('fieldset:nth-child(3) > label:nth-child(4) > textarea')?.placeholder, 'I like coding on the beach...');
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								```
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								# --seed--
 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								## --seed-contents--
 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								```html
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								<!DOCTYPE html> 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								< html > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								  < head > 
							 
						 
					
						
							
								
									
										
										
										
											2022-03-14 15:54:43 +00:00 
										
									 
								 
							 
							
								
									
										 
									 
								
							 
							
								 
							 
							
							
								    < title > Registration Form< / title > 
							 
						 
					
						
							
								
									
										
										
										
											2021-10-14 23:33:13 +01:00 
										
									 
								 
							 
							
								
							 
							
								 
							 
							
							
									  < link  rel = "stylesheet"  type = "text/css"  href = "styles.css"  / > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								  < / head > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								  < body > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								    < h1 > Registration Form< / h1 > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								    < p > Please fill out this form with the required information< / p > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								    < form  action = 'https://fcc-registration-form.com' > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								      < fieldset > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > Enter Your First Name: < input  type = "text"  required  / > < / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > Enter Your Last Name: < input  type = "text"  required  / > < / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > Enter Your Email: < input  type = "email"  required  / > < / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > Create a New Password: < input  type = "password"  pattern = "[a-z0-5]{8,}"  required  / > < / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								      < / fieldset > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								      < fieldset > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > < input  type = "radio"  name = "account-type"  / >  Personal Account< / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > < input  type = "radio"  name = "account-type"  / >  Business Account< / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								          < input  type = "checkbox"  required  / >  I accept the < a  href = "https://www.freecodecamp.org/news/terms-of-service/" > terms and conditions< / a > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
											  < / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								      < / fieldset > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								--fcc-editable-region--
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								      < fieldset > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > Upload a profile picture: < input  type = "file"  / > < / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > Input your age (years): < input  type = "number"  min = "13"  max = "120"  / > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
											  < / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > How did you hear about us?
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								          < select > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								            < option  value = "" > (select one)< / option > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								            < option  value = "1" > freeCodeCamp News< / option > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								            < option  value = "2" > freeCodeCamp YouTube Channel< / option > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								            < option  value = "3" > freeCodeCamp Forum< / option > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								            < option  value = "4" > Other< / option > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								          < / select > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								        < label > Provide a bio:
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
												  < textarea  rows = "3"  cols = "30" > < / textarea > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
											  < / label > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								      < / fieldset > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								--fcc-editable-region--
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								      < input  type = "submit"  value = "Submit"  / > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								    < / form > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								  < / body > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								< / html > 
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								```
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								```css
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								body {
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								  width: 100%;
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								  height: 100vh;
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								  margin: 0;
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								  background-color: #1b1b32 ;
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
									color: #f5f6f7 ;
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								}
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								label {
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
									display: block;
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
									margin: 0.5rem 0;
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								}
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								
							 
						 
					
						
							
								
							 
							
								
							 
							
								 
							 
							
							
								```