Skip to content

Commit 754a036

Browse files
AbduhasenAbduhasen
committed
wrote form control using html created input box for name and email, select for size choose,radio also for colour choose, used a lot <br> for spacing.
1 parent ff7b9d0 commit 754a036

1 file changed

Lines changed: 75 additions & 7 deletions

File tree

‎Form-Controls/index.html‎

Lines changed: 75 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html lang="en">
33
<head>
44
<meta charset="utf-8" />
@@ -13,15 +13,83 @@ <h1>Product Pick</h1>
1313
</header>
1414
<main>
1515
<form>
16-
<!-- write your html here-->
17-
<!--
18-
try writing out the requirements first as comments
19-
this will also help you fill in your PR message later-->
16+
<fieldset>
17+
<h2>Personal Information</h2>
18+
<ul>
19+
<li>
20+
<label for="fname">First Name *</label>
21+
<input
22+
type="text"
23+
name="fname"
24+
id="fname"
25+
maxlength="10"
26+
minlength="2"
27+
pattern="[A-Za-z]+"
28+
required
29+
/><br />
30+
<br />
31+
<label for="lname">Last Name *</label>
32+
<input
33+
type="text"
34+
name="lname"
35+
id="lname"
36+
maxlength="10"
37+
minlength="2"
38+
pattern="[A-Za-z]+"
39+
required
40+
/><br />
41+
<br />
42+
</li>
43+
44+
<li>
45+
<br />
46+
<label for="email">Email *</label>
47+
<input type="email" name="email" id="email" required /><br />
48+
</li>
49+
</ul>
50+
</fieldset>
51+
<fieldset>
52+
<h3>T-Shirt Colour and Size</h3>
53+
<p>T-shirt colour</p>
54+
<ol>
55+
<li>
56+
<input type="radio" id="Red" name="T-shirt_colour" value="Red" />
57+
<label for="Red">Red</label><br /><br />
58+
</li>
59+
<li>
60+
<input
61+
type="radio"
62+
id="White"
63+
name="T-shirt_colour"
64+
value="White"
65+
/>
66+
<label for="White">White</label><br /><br />
67+
</li>
68+
69+
<li>
70+
<input
71+
type="radio"
72+
id="Black"
73+
name="T-shirt_colour"
74+
value="Black"
75+
/>
76+
<label for="Black">Black</label><br /><br />
77+
</li>
78+
</ol>
79+
<label for="t-shirt_size">T-Shirt Size</label>
80+
<select id="t-shirt_size" name="t-shirt_size">
81+
<option>XS</option>
82+
<option>S</option>
83+
<option>M</option>
84+
<option>L</option>
85+
<option>XL</option>
86+
<option>XXL</option>
87+
</select>
88+
</fieldset>
2089
</form>
2190
</main>
2291
<footer>
23-
<!-- change to your name-->
24-
<p>By HOMEWORK SOLUTION</p>
92+
<p>By Abdu Hassen</p>
2593
</footer>
2694
</body>
2795
</html>

0 commit comments

Comments
 (0)