<script src="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/js/vendor/bs-custom-file-input.min.js"></script>
<script src="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/js/src/application.js"></script>
<script src="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/js/src/search.js"></script>
- <script src="{{ site.baseurl }}/docs/{{ site.docs_version }}/assets/js/src/ie-emulation-modes-warning.js"></script>
{%- endif -%}
+++ /dev/null
-// NOTICE!! DO NOT USE ANY OF THIS JAVASCRIPT
-// IT'S ALL JUST JUNK FOR OUR DOCS!
-// ++++++++++++++++++++++++++++++++++++++++++
-
-// Intended to prevent false-positive bug reports about Bootstrap not working properly in old versions of IE due to folks testing using IE's unreliable emulation modes.
-(function () {
- 'use strict'
-
- function emulatedIEMajorVersion() {
- var groups = /MSIE ([0-9.]+)/.exec(window.navigator.userAgent)
- if (groups === null) {
- return null
- }
- var ieVersionNum = parseInt(groups[1], 10)
- var ieMajorVersion = Math.floor(ieVersionNum)
- return ieMajorVersion
- }
-
- function actualNonEmulatedIEMajorVersion() {
- // Detects the actual version of IE in use, even if it's in an older-IE emulation mode.
- // IE JavaScript conditional compilation docs: https://msdn.microsoft.com/library/121hztk3%28v=vs.94%29.aspx
- // @cc_on docs: https://msdn.microsoft.com/library/8ka90k2e%28v=vs.94%29.aspx
- var jscriptVersion = new Function('/*@cc_on return @_jscript_version; @*/')() // eslint-disable-line no-new-func
- if (typeof jscriptVersion === 'undefined') {
- return 11 // IE11+ not in emulation mode
- }
- if (jscriptVersion < 9) {
- return 8 // IE8 (or lower; haven't tested on IE<8)
- }
- return jscriptVersion // IE9 or IE10 in any mode, or IE11 in non-IE11 mode
- }
-
- var ua = window.navigator.userAgent
- if (ua.indexOf('Opera') > -1 || ua.indexOf('Presto') > -1) {
- return // Opera, which might pretend to be IE
- }
- var emulated = emulatedIEMajorVersion()
- if (emulated === null) {
- return // Not IE
- }
- var nonEmulated = actualNonEmulatedIEMajorVersion()
-
- if (emulated !== nonEmulated) {
- // eslint-disable-next-line no-alert
- window.alert('WARNING: You appear to be using IE' + nonEmulated + ' in IE' + emulated + ' emulation mode.\nIE emulation modes can behave significantly differently from ACTUAL older versions of IE.\nPLEASE DON\'T FILE BOOTSTRAP BUGS based on testing in IE emulation modes!')
- }
-}())
{% capture callout %}
##### Caveat with anchors
-By default, browsers will treat all native form controls (`<input>`, `<select>` and `<button>` elements) inside a `<fieldset disabled>` as disabled, preventing both keyboard and mouse interactions on them. However, if your form also includes `<a ... class="btn btn-*">` elements, these will only be given a style of `pointer-events: none`. As noted in the section about [disabled state for buttons]({{ site.baseurl }}/docs/{{ site.docs_version }}/components/buttons/#disabled-state) (and specifically in the sub-section for anchor elements), this CSS property is not yet standardized and isn't fully supported in Internet Explorer 10, and won't prevent keyboard users from being able to focus or activate these links. So to be safe, use custom JavaScript to disable such links.
+By default, browsers will treat all native form controls (`<input>`, `<select>` and `<button>` elements) inside a `<fieldset disabled>` as disabled, preventing both keyboard and mouse interactions on them. However, if your form also includes `<a ... class="btn btn-*">` elements, these will only be given a style of `pointer-events: none`.
{% endcapture %}
{% include callout.html content=callout type="warning" %}
-{% capture callout %}
-#### Cross-browser compatibility
-
-While Bootstrap will apply these styles in all browsers, Internet Explorer 11 and below don't fully support the `disabled` attribute on a `<fieldset>`. Use custom JavaScript to disable the fieldset in these browsers.
-{% endcapture %}
-{% include callout.html content=callout type="danger" %}
-
## Validation
Provide valuable, actionable feedback to your users with HTML5 form validation–[available in all our supported browsers](https://caniuse.com/#feat=form-validation). Choose from the browser default validation feedback, or implement custom messages with our built-in classes and starter JavaScript.
### Range
-Create custom `<input type="range">` controls with `.custom-range`. The track (the background) and thumb (the value) are both styled to appear the same across browsers. As only IE and Firefox support "filling" their track from the left or right of the thumb as a means to visually indicate progress, we do not currently support it.
+Create custom `<input type="range">` controls with `.custom-range`. The track (the background) and thumb (the value) are both styled to appear the same across browsers. As only Firefox supports "filling" their track from the left or right of the thumb as a means to visually indicate progress, we do not currently support it.
{% capture example %}
<label for="customRange1">Example range</label>
{% endcapture %}
{% include example.html content=example %}
-{% capture callout %}
-##### Flexbug #12: Inline elements aren't treated as flex items
-
-Internet Explorer 10-11 do not render inline elements like links or images (or `::before` and `::after` pseudo-elements) as flex items. The only workaround is to set a non-inline `display` value (e.g., `block`, `inline-block`, or `flex`). We suggest using `.d-flex`, one of our [display utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/display/), as an easy fix.
-
-**Source:** [Flexbugs on GitHub](https://github.com/philipwalton/flexbugs#flexbug-12)
-{% endcapture %}
-{% include callout.html content=callout type="warning" %}
-
## Nesting
Media objects can be infinitely nested, though we suggest you stop at some point. Place nested `.media` within the `.media-body` of a parent media object.
<img src="..." class="img-fluid" alt="Responsive image">
{% endhighlight %}
-{% capture callout %}
-##### SVG images and IE 10
-
-In Internet Explorer 10, SVG images with `.img-fluid` are disproportionately sized. To fix this, add `width: 100% \9;` where necessary. This fix improperly sizes other image formats, so Bootstrap doesn't apply it automatically.
-{% endcapture %}
-{% include callout.html content=callout type="warning" %}
-
## Image thumbnails
In addition to our [border-radius utilities]({{ site.baseurl }}/docs/{{ site.docs_version }}/utilities/borders/), you can use `.img-thumbnail` to give an image a rounded 1px border appearance.
## Supported browsers
-Bootstrap supports the **latest, stable releases** of all major browsers and platforms. On Windows, **we support Internet Explorer 10-11 / Microsoft Edge**.
+Bootstrap supports the **latest, stable releases** of all major browsers and platforms. On Windows, **we only support Microsoft Edge**.
Alternative browsers which use the latest version of WebKit, Blink, or Gecko, whether directly or via the platform's web view API, are not explicitly supported. However, Bootstrap should (in most cases) display and function correctly in these browsers as well. More specific support information is provided below.
Chrome >= 45
Firefox >= 38
Edge >= 12
-Explorer >= 10
iOS >= 9
Safari >= 9
Android >= 4.4
<th scope="row">Windows</th>
<td class="text-success">Supported</td>
<td class="text-success">Supported</td>
- <td class="text-success">Supported, IE10+</td>
+ <td class="text-success">Not supported</td>
<td class="text-success">Supported</td>
<td class="text-success">Supported</td>
<td class="text-danger">Not supported</td>
## Internet Explorer
-Internet Explorer 10+ is supported; IE9 and down is not. Please be aware that some CSS3 properties and HTML5 elements are not fully supported in IE10, or require prefixed properties for full functionality. Visit [Can I use...](https://caniuse.com/) for details on browser support of CSS3 and HTML5 features. **If you require IE8-9 support, use Bootstrap 3.**
+Internet Explorer 11 is not supported officially. However, if you build Bootstrap yourself, you can add the needed CSS prefixes and follow the instructions on the [JavaScript page]({{ site.baseurl }}/docs/{{ site.docs_version }}/getting-started/javascript/#compatibility-with-ie-11). Please note that this might break at any time. **If you require Internet Explorer 10/11 support, use Bootstrap 4.**
## Modals and dropdowns on mobile
## Alignment
-Use flexbox alignment utilities to vertically and horizontally align columns. **Internet Explorer 10-11 do not support vertical alignment of flex items when the flex container has a `min-height` as shown below.** [See Flexbugs #3 for more details.](https://github.com/philipwalton/flexbugs#flexbug-3)
+Use flexbox alignment utilities to vertically and horizontally align columns.
### Vertical alignment
projects / thirdparty / bootstrap.git / commitdiff
