Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Flex basis

See original GitHub issue

I thinks You can add more flex utilities. Here is for flex-basis. What does it do? It stretches div to full width. It could be useful (I needed it as in screenshots). There could be also variations like 25, 50, 75 (as in w-x)

.flex-basis-100 {
  flex-basis: 100% !important;
}

.flex-basis-0 {
  flex-basis: auto !important;
}


@each $breakpoint in map-keys($grid-breakpoints) {
  @include media-breakpoint-up($breakpoint) {
    $infix: breakpoint-infix($breakpoint, $grid-breakpoints);

    .flex#{$infix}-basis-100 {
      flex-basis: 100% !important;
    }
    .flex#{$infix}-basis-0 {
      flex-basis: auto !important;
    }
  }
}

bootstrap-basis-md bootstrap-basis-sm

Issue Analytics

State:
Created 5 years ago
Comments:5 (4 by maintainers)

Top GitHub Comments

2reactions

florianlacreusecommented, Dec 5, 2018

Just to let you know that this is already possible with the current available utilities: https://codepen.io/anon/pen/zMVOyK

1reaction

florianlacreusecommented, Dec 6, 2018

@piernik Confirm, there are no reponsive sizing utilities and according to this comment there are no plans to add responsive variants any time soon (for sizing things).