11<!DOCTYPE html>
22< html lang ="en ">
3- < head >
4- < meta charset ="utf-8 " />
5- < meta http-equiv ="X-UA-Compatible " content ="IE=edge " />
3+ < head >
4+ < meta charset ="utf-8 "/>
5+ < meta http-equiv ="X-UA-Compatible " content ="IE=edge "/>
66 < title > My form exercise</ title >
7- < meta name ="description " content ="" />
8- < meta name ="viewport " content ="width=device-width, initial-scale=1 " />
9- </ head >
10- < body >
11- < header >
12- < h1 > Product Pick</ h1 >
13- </ header >
14- < main >
15- < form >
7+ < meta name ="description " content =""/>
8+ < meta name ="viewport " content ="width=device-width, initial-scale=1 "/>
9+ </ head >
10+ < body >
11+ < header >
12+ < h1 > Product Pick</ h1 >
13+ </ header >
14+ < main >
15+ < form >
1616 <!-- write your html here-->
17- <!--
17+ <!--
1818 try writing out the requirements first as comments
1919 this will also help you fill in your PR message later-->
20-
21- <!-- first and lastname (ensure it contains at least two non-space characters.)-->
22- <!-- email (make sure the email is valid. Email addresses follow a consistent pattern.)-->
23- <!-- shirt color (I must provide 3 options. How will I ensure they do not choose other colors?)-->
24- <!-- shirt size (must provide the following 6 options: XS, S, M, L, XL, XXL)-->
25- < div class ="form ">
26-
27- < div class ="form-group ">
28- < label for ="firstname "> First Name</ label >
29- < input
30- type ="text "
31- id ="firstname "
32- name ="firstname "
33- required
34- pattern =""
35- title =""
36- >
37- </ div >
38-
39- < div class ="form-group ">
40- < label for ="lastname "> Last Name</ label >
41- < input
42- type ="text "
43- id ="lastname "
44- name ="lastname "
45- required
46- pattern =""
47- title ="">
48- </ div >
49-
50- < div class ="form-group ">
51- < label for ="email "> Email</ label >
52- < input
53- type ="email "
54- id ="email "
55- name ="email "
56- required
57- pattern =""
58- title ="">
59- </ div >
60-
61- < div class ="form-group ">
62- < fieldset >
63- < legend > Choose a shirt color:</ legend >
64- < div class ="form-group-fieldset ">
65- < input
66- type ="radio "
67- id ="choice1 "
68- name ="shirt "
69- value ="blue "
70- >
71- < label for ="choice1 "> Blue</ label >
72- </ div >
73-
74- < div class ="form-group-fieldset ">
75- < input
76- type ="radio "
77- id ="choice2 "
78- name ="shirt "
79- value ="green "
80- >
81- < label for ="choice2 "> Green</ label >
82- </ div >
83-
84- < div class ="form-group-fieldset ">
85- < input
86- type ="radio "
87- id ="choice3 "
88- name ="shirt "
89- value ="yellow "
90- >
91- < label for ="choice3 "> Yellow</ label >
92- </ div >
93- </ fieldset >
94- </ div >
95-
96- < div class ="form-group ">
97- < label for ="sizing "> Choose a size:</ label >
98- < select id ="sizing " name ="size ">
99- < option value =""> --Please choose an option--</ option >
100- < option value ="ex-small "> XS</ option >
101- < option value ="small "> S</ option >
102- < option value ="medium "> M</ option >
103- < option value ="large "> L</ option >
104- < option value ="ex-large "> XL</ option >
105- < option value ="ex-ex-large "> XXL</ option >
106-
107- </ select >
108- </ div >
109- </ div >
110- </ form >
111- </ main >
112- < footer >
113- <!-- change to your name-->
114- < p > By DAMILOLA ODUMOSU</ p >
115- </ footer >
116- </ body >
117- </ html >
20+ </ form >
21+ </ main >
22+ < footer >
23+ <!-- change to your name-->
24+ < p > By HOMEWORK SOLUTION</ p >
25+ </ footer >
26+ </ body >
27+ </ html >
0 commit comments