Make equal-width flexbox extend grid-column #20775
Conversation
Fixed equal-width flexbox columns so now they will act like normal columns as they break.
| @include media-breakpoint-up($breakpoint, $breakpoints) { | ||
| // Provide basic `.col-{bp}` classes for equal-width flexbox columns | ||
| @if $enable-flex { | ||
| .col-#{$breakpoint} { | ||
| position: relative; | ||
| width: auto !important; |
There was a problem hiding this comment.
Properties should be ordered flex-basis, flex-grow, width, max-width, min-height
|
A |
|
What does this fix exactly? I don't see the benefit of this without a JS Bin or demo showing the before and after. |
| @@ -28,18 +28,22 @@ | |||
| @extend %grid-column; | |||
| } | |||
| } | |||
|
|
|||
|
These equal-width flexbox classes aren't breaking as normal columns do. When they were supposed to break, they just don't break, making the breakpoints useless on them. It happens because they were not extending %grid-column. Here's an example: https://jsbin.com/baqoriqagu/edit?html,css,output Just change the |
|
Gotcha. Okay, I took a look and cleaned some things up in #20829. Thanks! |
Fixed equal-width flexbox columns, so now they will act like normal columns as they break.