From 0b5badd591e63b1dcc914a2479f681b9297e6514 Mon Sep 17 00:00:00 2001
From: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Wed, 15 Jan 2014 14:21:28 -0800
Subject: [PATCH] Fix `font` and `color` inheritance for forms

Inherit all `font` properties.

Inherit `color` for form controls. Chrome and Safari on OS X will not
inherit `color` as they heavily restrict the author-defined styles that
will be respected for that element.

Fix gh-157
---
 normalize.css | 9 +++++----
 test.html     | 9 +++++++++
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/normalize.css b/normalize.css
index a892722..4601d6f 100644
--- a/normalize.css
+++ b/normalize.css
@@ -279,8 +279,9 @@ legend {
 }
 
 /**
- * 1. Correct font family not being inherited in all browsers.
- * 2. Correct font size not being inherited in all browsers.
+ * 1. Correct color not being inherited in all browsers.
+ *    Known issue: `select` will not inherit color in Chrome and Safari on OS X.
+ * 2. Correct font properties not being inherited in all browsers.
  * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
  */
 
@@ -288,8 +289,8 @@ button,
 input,
 select,
 textarea {
-    font-family: inherit; /* 1 */
-    font-size: 100%; /* 2 */
+    color: inherit; /* 1 */
+    font: inherit; /* 2 */
     margin: 0; /* 3 */
 }
 
diff --git a/test.html b/test.html
index ab9a79b..51dda7b 100644
--- a/test.html
+++ b/test.html
@@ -275,6 +275,15 @@
                 </fieldset>
             </div>
 
+            <fieldset style="color: green">
+                <legend>Color inheritance</legend>
+                <p><label>Text input <input type="text" value="should be green"></label></p>
+                <p><label>Email input <input type="email"></label></p>
+                <p><label>Search input <input type="search"></label></p>
+                <p><label>Select field <select><option>Option 01</option><option>Option 02</option></select></label></p>
+                <p><label>Textarea <textarea cols="30" rows="5" >Textarea text</textarea></label></p>
+            </fieldset>
+
             <fieldset>
                 <legend>Inputs as descendents of labels (form legend). This doubles up as a long legend that can test word wrapping.</legend>
                 <p><label>Text input <input type="text" value="default value that goes on and on without stopping or punctuation"></label></p>