Remove box-sizing for input[type="search"]

This normalizes the CSS to what the suggested default browser CSS should
be, which is now implemented in IE11, Edge, Blink, WebKit and Gecko (for
the latter, see https://www.w3.org/Bugs/Public/show_bug.cgi?id=28784)

References twbs/bootstrap#17379

Closes #471
This commit is contained in:
Patrick H. Lauke 2016-01-06 10:11:41 +00:00 committed by Nicolas Gallagher
parent 64de79a543
commit fe567632af
2 changed files with 2 additions and 10 deletions

6
normalize.css vendored
View File

@ -348,13 +348,11 @@ input[type="number"]::-webkit-outer-spin-button {
} }
/** /**
* 1. Address `appearance` set to `searchfield` in Safari and Chrome. * Address `appearance` set to `searchfield` in Safari and Chrome.
* 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
*/ */
input[type="search"] { input[type="search"] {
-webkit-appearance: textfield; /* 1 */ -webkit-appearance: textfield;
box-sizing: content-box; /* 2 */
} }
/** /**

View File

@ -429,12 +429,6 @@
<div class="Test-run"> <div class="Test-run">
<input type="search" style="border:1px solid #ADD8E6; padding:10px; width:200px;"> <input type="search" style="border:1px solid #ADD8E6; padding:10px; width:200px;">
</div> </div>
<h3 class="Test-it">should have a <code>content-box</code> box model</h3>
<div class="Test-run">
<div style="background:red; display:inline-block; height:62px; width:242px;">
<input type="search" style="border:1px solid #ADD8E6; height:20px; padding:20px; width:200px;">
</div>
</div>
<h3 class="Test-it">should not have a cancel button in Safari or Chrome</h3> <h3 class="Test-it">should not have a cancel button in Safari or Chrome</h3>
<div class="Test-run"> <div class="Test-run">
<input type="search" value="search"> <input type="search" value="search">