Fix fieldset width in Chrome and Firefox

Fixes an issue in Firefox [1] and Chrome [2]. The implicit width of
`fieldset` can be determined by the width of descendants rather than the
parent container. This change (adding `min-width:0`) makes the
`fieldset` behave like a `div` in this regard.

[1] https://bugzilla.mozilla.org/show_bug.cgi?id=504622
[2] http://stackoverflow.com/questions/8084343/google-chrome-fieldset-overflow-bug

Close #272

normalize.css

@@ -257,13 +257,15 @@ figure {
    ========================================================================== */
 
 /**
- * Define consistent border, margin, and padding.
+ * 1. Define consistent border, margin, and padding.
+ * 2. Address width being affected by wide descendants in Chrome and Firefox.
  */
 
 fieldset {
-    border: 1px solid #c0c0c0;
-    margin: 0 2px;
-    padding: 0.35em 0.625em 0.75em;
+    border: 1px solid #c0c0c0; /* 1 */
+    margin: 0 2px; /* 1 */
+    min-width: 0; /* 2 */
+    padding: 0.35em 0.625em 0.75em; /* 1 */
 }
 
 /**

test.html

@@ -268,6 +268,13 @@
         <h1>Forms</h1>
 
         <form>
+            <div style="width:500px;">
+                <fieldset>
+                    <legend>Fieldset with a wider child</legend>
+                    <div style="width:600px; height:50px; background:red;"></div>
+                </fieldset>
+            </div>
+
             <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>