What about IE10?

[techboyg5]

What about IE10 support too? Just use display:ms-flexbox everywhere that display:flex is used and it should work.

[coliff]

heya - good question! I'd thought about this. As IE10's marketshare is really, really tiny (0.02% - compared to IE11's 1.38%) I decided not to include IE10 fixes in this project. IE10 is completely unsupported and Windows 7/8 users with IE10 will have received automatic updates to IE11.

As you mentioned, IE10 requires prefixes for flexbox which would increase the size of the CSS. I do think I'll add a section to the README Faqs with a list of things to fix if users do want to add support themselves. The CSS would be something like this:

/* Bootstrap 5 for IE10 */

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  /* Shim for "new" HTML5 structural elements to display correctly */
  article,
  aside,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  main,
  nav,
  section {
    display: block;
  }

  /* Add a `max-width` to ensure content within each column does not blow out */
  /* the width of the column. Applies to IE10+ */
  .col,
  .col-12
  .col-auto {
    max-width: 100%;
  }

  /* Changes flex-bases to auto because of an IE10 bug */
  .navbar-collapse {
    flex-basis: auto;
  }

  /* IE10 bugfix, see https://stackoverflow.com/questions/16947967/ie10-hover-pseudo-class-doesnt-work-without-background-color */
  .stretched-link::after {
    background-color: rgba(0, 0, 0, 0);
  }

  /* REF: https://github.com/twbs/bootstrap/issues/23476 */
  /* this can be buggy though, so use with caution and test */
  .img-fluid[src$=".svg"] {
    width: 100%;
  }
}