11<!DOCTYPE html>
22< html lang ="en ">
3- <head>
4- <meta charset="utf-8" />
5- <meta http-equiv="X-UA-Compatible" content="IE=edge" />
6- <title>My form exercise</title>
7- <meta name="description" content="" />
8- <meta name="viewport" content="width=device-width, initial-scale=1" />
9- <link rel="stylesheet" href="style.css" />
10- </head>
11- <body>
12- <header>
13- <h1>Product Pick</h1>
14- </header>
15- <main>
16- <form>
3+
4+ < head >
5+ < meta charset ="utf-8 " />
6+ < meta http-equiv ="X-UA-Compatible " content ="IE=edge " />
7+ < title > My form exercise</ title >
8+ < meta name ="description " content ="" />
9+ < meta name ="viewport " content ="width=device-width, initial-scale=1 " />
10+ < link rel ="stylesheet " href ="style.css " />
11+ </ head >
12+
13+ < body >
14+ < header >
15+ < h1 > Product Pick</ h1 >
16+ </ header >
17+ < main >
18+ < form >
19+ < div >
20+ < label for ="full-name "> Name</ label >
21+ < input type ="text " id ="full-name " name ="full-name " required minlength ="2 " pattern =".*\S,*\S.* "
22+ title ="Please enter at least two nonspace characters ">
23+ </ div >
24+ < div >
25+ < label for ="email "> Email</ label >
26+ < input type ="email " id ="email " name ="email " required >
27+ </ div >
28+ < div class ="tshirt-colour ">
29+ < legend > T-shirt Colour</ legend >
1730 < div >
18- <label for="full-name">Name</label>
19- <input
20- type="text"
21- id="full-name"
22- name="full-name"
23- required
24- minlength="2"
25- pattern=".*\S,*\S.*"
26- title="Please enter at least two nonspace characters">
31+ < input type ="radio " id ="red " name ="colour " value ="red " required >
32+ < label for ="red "> red</ label >
2733 </ div >
2834 < div >
29- <label for="email">Email</label>
30- <input
31- type="email"
32- id="email"
33- name="email"
34- required>
35- </div>
36- <div class="tshirt-colour">
37- <legend>T-shirt Colour</legend>
38- <div>
39- <input type="radio" id="red" name="colour" value="red" required>
40- <label for="red">red</label>
41- </div>
42- <div>
43- <input type="radio" id="green" name="colour" value="green" required>
44- <label for="green">green</label>
45- </div>
46- <div>
47- <input type="radio" id="blue" name="colour" value="blue" required>
48- <label for="blue">blue</label>
49- </div>
35+ < input type ="radio " id ="green " name ="colour " value ="green " required >
36+ < label for ="green "> green</ label >
5037 </ div >
5138 < div >
52- <label for="size">T-shirt Size</label>
53- <select id="size" name="size" required>
54- <option value="">Select size</option>
55- <option value="xs">XS</option>
56- <option value="s">S</option>
57- <option value="m">M</option>
58- <option value="l">L</option>
59- <option value="xl">XL</option>
60- <option value="xxl">XXL</option>
61- </select>
39+ < input type ="radio " id ="blue " name ="colour " value ="blue " required >
40+ < label for ="blue "> blue</ label >
6241 </ div >
63- <button type="submit">Confirm Order</button>
64-
65- </form>
66- </main>
67- <footer>
68- <p>Carolina Maday Villa Huanca</p>
69- </footer>
70- </body>
42+ </ div >
43+ < div >
44+ < label for ="size "> T-shirt Size</ label >
45+ < select id ="size " name ="size " required >
46+ < option value =""> Select size</ option >
47+ < option value ="xs "> XS</ option >
48+ < option value ="s "> S</ option >
49+ < option value ="m "> M</ option >
50+ < option value ="l "> L</ option >
51+ < option value ="xl "> XL</ option >
52+ < option value ="xxl "> XXL</ option >
53+ </ select >
54+ </ div >
55+ < button type ="submit "> Confirm Order</ button >
56+
57+ </ form >
58+ </ main >
59+ < footer >
60+ < p > Carolina Maday Villa Huanca</ p >
61+ </ footer >
62+ </ body >
63+
7164</ html >
0 commit comments