library-mirrors/normalize.css
1
0
Fork 0
mirror of https://github.com/necolas/normalize.css.git synced 2024-12-25 15:14:19 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Prevent text inputs growing as you type in IE6/7. Fix #46

Browse Source 
Applying *overflow:visible to button/input causes text inputs to
grow to fit their content, even if an explicit, fixed width is
applied. It was originally included to remove excess inner
spacing on buttons and submit/reset/button-type inputs in IE6/7.

Fixing this bug in IE6 requires dropping the fix entirely because
there is no way to avoid it being applied to text inputs. If
there is a need to fix this excess spacing bug in IE6, then it
should be done using a class that is applied to the
necessary elements.

For IE7, the excess spacing fix can be moved into the ruleset
that targets button and submit/reset/button-type inputs. This
prevents text inputs from growing.
This commit is contained in:
Nicolas Gallagher 2011-09-22 18:31:16 +01:00
parent 5e64a2c5cb
commit 6d085d7e52
2 changed files with 6 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
demo.html
View File

@ -235,7 +235,7 @@
<form> <form>
<fieldset> <fieldset>
<legend>Inputs as descendents of labels (form legend)</legend> <legend>Inputs as descendents of labels (form legend)</legend>
<p><label>Text input <input type="text" value="default value"></label></p> <p><label>Text input <input type="text" value="default value that goes on and on without stopping or punctuation"></label></p>
<p><label>Email input <input type="email"></label></p> <p><label>Email input <input type="email"></label></p>
<p><label>Search input <input type="search"></label></p> <p><label>Search input <input type="search"></label></p>
<p><label>Tel input <input type="tel"></label></p> <p><label>Tel input <input type="tel"></label></p>

19
normalize.css vendored
View File

@ -1,4 +1,4 @@
/*! normalize.css 2011-09-14T10:27 UTC - http://github.com/necolas/normalize.css */ /*! normalize.css 2011-09-22T17:42 UTC - http://github.com/necolas/normalize.css */
/* ============================================================================= /* =============================================================================
HTML5 display definitions HTML5 display definitions
@ -340,29 +340,19 @@ textarea {
} }
/* /*
* 1. Addresses FF3/4 setting line-height using !important in the UA stylesheet * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet
* 2. Corrects inner spacing displayed oddly in IE6/7
*/ */
button, button,
input { input {
line-height: normal; /* 1 */ line-height: normal; /* 1 */
*overflow: visible; /* 2 */
}
/*
* Corrects overlap and whitespace issue for buttons and inputs in IE6/7
* Known issue: reintroduces inner spacing
*/
table button,
table input {
*overflow: auto;
} }
/* /*
* 1. Improves usability and consistency of cursor style between image-type 'input' and others * 1. Improves usability and consistency of cursor style between image-type 'input' and others
* 2. Corrects inability to style clickable 'input' types in iOS * 2. Corrects inability to style clickable 'input' types in iOS
* 3. Corrects inner spacing displayed oddly in IE7 without effecting normal text inputs
* Known issue: inner spacing remains in IE6
*/ */
button, button,
@ -371,6 +361,7 @@ input[type="reset"],
input[type="submit"] { input[type="submit"] {
cursor: pointer; /* 1 */ cursor: pointer; /* 1 */
-webkit-appearance: button; /* 2 */ -webkit-appearance: button; /* 2 */
*overflow: visible; /* 3 */
} }
/* /*