Bootstrap 4 additions / utilities / overrides

bootstrap-util.md

Responsive sizing

$sizes: (
  auto: auto,
  25: 25%,
  50: 50%,
  75: 75%,
  100: 100%,
);

@each $breakpoint in map-keys($grid-breakpoints) {
  @include media-breakpoint-up($breakpoint) {
    $infix: breakpoint-infix($breakpoint, $grid-breakpoints);
    @each $prop, $abbrev in (width: w, height: h) {
      // NOTE: you can add (max-width: mw, max-height: mh) above if needed
      @each $size, $length in $sizes {
        .#{$abbrev}#{$infix}-#{$size} { #{$prop}: $length !important; }
      }
    }
  }
}