// ============================================================================= // Forms // ========================================================================== // Corrects margin displayed oddly in IE6/7 form { margin: 0; } // Define consistent border, margin, and padding fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } // 1. Corrects color not being inherited in IE6/7/8/9 // 2. Corrects text not wrapping in FF3 // 3. Corrects alignment displayed oddly in IE6/7 legend { border: 0; // 1 padding: 0; white-space: normal; // 2 *margin-left: -7px; // 3 } // 1. Corrects font size not being inherited in all browsers // 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome // 3. Improves appearance and consistency in all browsers button, input, select, textarea { font-size: 100%; // 1 margin: 0; // 2 vertical-align: baseline; // 3 *vertical-align: middle; // 3 } // Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet button, input { line-height: normal; } // 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` // and `video` controls. // 2. Corrects inability to style clickable `input` types in iOS. // 3. Improves usability and consistency of cursor style between image-type // `input` and others. // 4. Removes inner spacing in IE7 without affecting normal text inputs. // Known issue: inner spacing remains in IE6. button, html input[type="button"], // 1 input[type="reset"], input[type="submit"] { -webkit-appearance: button; // 2 cursor: pointer; // 3 *overflow: visible; // 4 } // Re-set default cursor for disabled elements button[disabled], input[disabled] { cursor: default; } // 1. Addresses box sizing set to content-box in IE8/9 // 2. Removes excess padding in IE8/9 // 3. Removes excess padding in IE7 // Known issue: excess padding remains in IE6 input[type="checkbox"], input[type="radio"] { box-sizing: border-box; // 1 padding: 0; // 2 *height: 13px; // 3 *width: 13px; // 3 } // 1. Addresses appearance set to searchfield in S5, Chrome // 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof) input[type="search"] { -webkit-appearance: textfield; // 1 -moz-box-sizing: content-box; -webkit-box-sizing: content-box; // 2 box-sizing: content-box; } // Removes inner padding and search cancel button in S5, Chrome on OS X input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; } // Removes inner padding and border in FF3+. button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } // 1. Removes default vertical scrollbar in IE6/7/8/9 // 2. Improves readability and alignment in all browsers textarea { overflow: auto; // 1 vertical-align: top; // 2 }