Merge pull request #51 from icaaq/a11y-labels

fixed some input issues
mozilla · Jun 4, 2012 · 8113c3c · 8113c3c
2 parents e43d746 + 9fa9ae2
commit 8113c3c
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 1 deletion.
diff --git a/static/css/devices.css b/static/css/devices.css
@@ -44,6 +44,14 @@ aside {
     list-style-type: none;
     overflow: hidden;
 }
+.a11y {
+    position:absolute!important;
+    height:1px;
+    width:1px; 
+    overflow:hidden;
+    clip:rect(1px 1px 1px 1px); /* IE6, IE7 */
+    clip:rect(1px, 1px, 1px, 1px);
+}
 /**= Sections */
 /* Masthead */
 .masthead {

diff --git a/templates/index.html b/templates/index.html
@@ -137,7 +137,8 @@ <h1>Badges 101</h1>
             <section id="get-badge">
               <p class="instructions">If you'd like to send this badge to your Mozilla backpack, just fill out the form below.</p>
               <form>
-                <input type="text" id="email" placeholder="E-mail Address">
+                <label for="email">Your E-mail Address</label>
+                <input type="email" id="email" placeholder="E-mail Address">
                 <input type="submit" value="Send To Backpack »" id="submit">
               </form>
               <p><small>This will push your badge to the Mozilla Badge Backpack which is governed by the Mozilla Badge Backpack Terms of Use and Privacy Policy.</small></p>