diff --git a/site/docs/4.5/examples/floating-labels/floating-labels.css b/site/docs/4.5/examples/floating-labels/floating-labels.css index d8ad2f3c15db..1abf4c44cc55 100644 --- a/site/docs/4.5/examples/floating-labels/floating-labels.css +++ b/site/docs/4.5/examples/floating-labels/floating-labels.css @@ -67,11 +67,23 @@ body { color: transparent; } +.form-label-group input:not(:-ms-input-placeholder) { + padding-top: 1.25rem; + padding-bottom: .25rem; +} + .form-label-group input:not(:placeholder-shown) { padding-top: 1.25rem; padding-bottom: .25rem; } +.form-label-group input:not(:-ms-input-placeholder) ~ label { + padding-top: .25rem; + padding-bottom: .25rem; + font-size: 12px; + color: #777; +} + .form-label-group input:not(:placeholder-shown) ~ label { padding-top: .25rem; padding-bottom: .25rem; @@ -89,14 +101,3 @@ body { color: #777; } } - -/* Fallback for IE --------------------------------------------------- */ -@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) { - .form-label-group > label { - display: none; - } - .form-label-group input:-ms-input-placeholder { - color: #777; - } -} diff --git a/site/docs/4.5/examples/floating-labels/index.html b/site/docs/4.5/examples/floating-labels/index.html index d837ccaf1c89..f4b525d5010e 100644 --- a/site/docs/4.5/examples/floating-labels/index.html +++ b/site/docs/4.5/examples/floating-labels/index.html @@ -9,7 +9,7 @@

Floating labels

-

Build form controls with floating labels via the :placeholder-shown pseudo-element. Works in latest Chrome, Safari, and Firefox.

+

Build form controls with floating labels via the :placeholder-shown pseudo-element. Works in latest Chrome, Safari, Firefox and IE 10/11 (prefixed).