mirror of
https://github.com/twbs/bootstrap.git
synced 2025-02-19 16:54:24 +01:00
Floating labels examples in IE (#30965)
* docs(example): drop IE workaround since it works fine in IE * Serial comma Co-authored-by: XhmikosR <xhmikosr@gmail.com> Co-authored-by: Mark Otto <markd.otto@gmail.com>
This commit is contained in:
parent
5b8163301c
commit
7c6a0db820
@ -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;
|
||||
}
|
||||
}
|
||||
|
@ -9,7 +9,7 @@ include_js: false
|
||||
<div class="text-center mb-4">
|
||||
<img class="mb-4" src="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/brand/bootstrap-solid.svg" alt="" width="72" height="72">
|
||||
<h1 class="h3 mb-3 font-weight-normal">Floating labels</h1>
|
||||
<p>Build form controls with floating labels via the <code>:placeholder-shown</code> pseudo-element. <a href="https://caniuse.com/#feat=css-placeholder-shown">Works in latest Chrome, Safari, and Firefox.</a></p>
|
||||
<p>Build form controls with floating labels via the <code>:placeholder-shown</code> pseudo-element. <a href="https://caniuse.com/#feat=css-placeholder-shown">Works in latest Chrome, Safari, Firefox, and IE 10/11 (prefixed).</a></p>
|
||||
</div>
|
||||
|
||||
<div class="form-label-group">
|
||||
|
Loading…
x
Reference in New Issue
Block a user