Skip to content

Commit 76b166f

Browse files
Mugs3Mugs3
committed
formatted both documents and change form method to get
1 parent 384c503 commit 76b166f

1 file changed

Lines changed: 40 additions & 33 deletions

File tree

‎Form-Controls/index.html‎

Lines changed: 40 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
1-
<!DOCTYPE html>
1+
<!doctype html>
22
<html lang="en">
33
<head>
44
<meta charset="utf-8" />
55
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
66
<title>My form exercise</title>
7-
<link rel="stylesheet" href="style.css">
7+
<link rel="stylesheet" href="style.css" />
88
<meta name="description" content="" />
99
<meta name="viewport" content="width=device-width, initial-scale=1" />
1010
</head>
@@ -13,47 +13,54 @@
1313
<h1>Product Pick</h1>
1414
</header>
1515
<main>
16-
<form method="post">
16+
<form method="post">
1717
<div>
18-
<label for="CustomerName">Customer Name:</label>
19-
<input type="text" id="CustomerName" name="CustomerName" required pattern=".*\S.*\S.*" title="Enter at least two non-space characters">
18+
<label for="CustomerName">Customer Name:</label>
19+
<input
20+
type="text"
21+
id="CustomerName"
22+
name="CustomerName"
23+
required
24+
pattern=".*\S.*\S.*"
25+
title="Enter at least two non-space characters"
26+
/>
2027
</div>
2128
<div>
22-
<label for="CustomerEmail">Customer Email:</label>
23-
<input
24-
type="email"
25-
id="CustomerEmail"
26-
name="CustomerEmail"
27-
required
28-
pattern="[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}"
29-
title="Enter an email address such as name@example.com"
30-
>
29+
<label for="CustomerEmail">Customer Email:</label>
30+
<input
31+
type="email"
32+
id="CustomerEmail"
33+
name="CustomerEmail"
34+
required
35+
pattern="[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}"
36+
title="Enter an email address such as name@example.com"
37+
/>
3138
</div>
3239
<div>
33-
<label for="T-ShirtsColor">T-Shirt Color:</label>
34-
<select id="T-ShirtsColor" name="T-ShirtsColor" required>
35-
<option value="" selected disabled>Choose a color</option>
36-
<option value="Red">Red</option>
37-
<option value="Blue">Blue</option>
38-
<option value="Green">Green</option>
39-
</select>
40+
<label for="T-ShirtsColor">T-Shirt Color:</label>
41+
<select id="T-ShirtsColor" name="T-ShirtsColor" required>
42+
<option value="" selected disabled>Choose a color</option>
43+
<option value="Red">Red</option>
44+
<option value="Blue">Blue</option>
45+
<option value="Green">Green</option>
46+
</select>
4047
</div>
4148
<div>
42-
<label for="T-ShirtsSize">T-Shirt Size:</label>
43-
<select id="T-ShirtsSize" name="T-ShirtsSize" required>
44-
<option value="" selected disabled>Choose a size</option>
45-
<option value="XS">XS</option>
46-
<option value="S">S</option>
47-
<option value="M">M</option>
48-
<option value="L">L</option>
49-
<option value="XL">XL</option>
50-
<option value="XXL">XXL</option>
51-
</select>
49+
<label for="T-ShirtsSize">T-Shirt Size:</label>
50+
<select id="T-ShirtsSize" name="T-ShirtsSize" required>
51+
<option value="" selected disabled>Choose a size</option>
52+
<option value="XS">XS</option>
53+
<option value="S">S</option>
54+
<option value="M">M</option>
55+
<option value="L">L</option>
56+
<option value="XL">XL</option>
57+
<option value="XXL">XXL</option>
58+
</select>
5259
</div>
5360
<div>
54-
<button type="submit">Place Order</button>
61+
<button type="submit">Place Order</button>
5562
</div>
56-
</form>
63+
</form>
5764
</main>
5865
<footer>
5966
<p>By Carol Nassuna</p>

0 commit comments

Comments
 (0)