CodeYourFuture
diff --git a/‎Form-Controls/index.html‎
Lines changed: 5 additions & 5 deletions b/‎Form-Controls/index.html‎
Lines changed: 5 additions & 5 deletions
diff --git a/‎Form-Controls/main.css‎
Lines changed: 34 additions & 0 deletions b/‎Form-Controls/main.css‎
Lines changed: 34 additions & 0 deletions
@@ -7,7 +7,6 @@
     <meta name="description" content=""/>
     <meta name="viewport" content="width=device-width, initial-scale=1"/>
     <link rel="stylesheet" href="main.css">
-
 </head>
 <body>
 <header>
@@ -16,7 +15,7 @@ <h1>Product Pick</h1>
     </div>
 </header>
 <main>
-    <div class="container">
+    <div class="container main-container">
         <form>
             <!-- write your HTML here-->
             <!--
@@ -36,7 +35,7 @@ <h1>Product Pick</h1>
                         id="firstname"
                         name="firstname"
                         required
-                        pattern="^[A-Za-z]{2,15}$"
+                        pattern="^[A-Za-z\s'-]{2,}$"
                         title="first name must be between 2 and 15 characters"
                 >
             </div>
@@ -48,7 +47,7 @@ <h1>Product Pick</h1>
                         id="lastname"
                         name="lastname"
                         required
-                        pattern="^[A-Za-z]{2,15}$"
+                        pattern="^[A-Za-z\s'-]{2,}$"
                         title="last name must be between 2 and 15 characters">
             </div>
 
@@ -71,6 +70,7 @@ <h1>Product Pick</h1>
                                 id="choice1"
                                 name="shirt"
                                 value="blue"
+                                required
                         >
                         <label for="choice1">Blue</label>
                     </div>
@@ -99,7 +99,7 @@ <h1>Product Pick</h1>
 
             <div class="form-group">
                 <label for="sizing">Choose a size:</label>
-                <select id="sizing" name="size">
+                <select id="sizing" name="size" required>
                     <option value="">--Please choose an option--</option>
                     <option value="ex-small">XS</option>
                     <option value="small">S</option>
 
@@ -0,0 +1,34 @@
+*{
+    box-sizing: border-box;
+}
+
+body{
+    margin:0;
+    padding:0;
+    font-family: "Times New Roman", Times, serif;
+    /*line-height:;*/
+    background:#403d39;
+}
+header, footer{
+    background:#ccc5b9;
+}
+/*footer{*/
+/*    */
+/*}*/
+.main-container{
+    background:#edede9;
+    padding:40px 30px;
+}
+.container{
+    /*width:;*/
+    margin: 0 auto;
+}
+h1{
+    font-size:2rem;
+    text-align:center;
+    margin-top: 0;
+    padding:30px 0;
+}
+.form-group{
+    margin-bottom:10px;
+}