philipwalton
Border to fix Flexbug #11?
I've received a few issues in Bootstrap about this super sneaky bug for wrapping (equal-width) flex items across multiple lines. While fiddling around, I was wondering why this worked without issue in our docs and it turns out the reason is our borders. See https://output.jsbin.com/micohor/.
Unsure if this is a reasonable workaround for you, but it's easier than setting an explicit flex-basis as that requires you know the actual percentage to add. With the border fix, you can even do a very small decimal border-width like .000001px and the columns size and break properly.
Related issues from Bootstrap:
- https://github.com/philipwalton/flexbugs/issues/201
- https://github.com/twbs/bootstrap/issues/21620
- https://github.com/twbs/bootstrap/issues/21967
Sorry to take a while to get to this.
Yeah, if that border trick works that seems like a better fix (or at least a good alternative) to the proposed workaround.
Unfortunately, I can't test it because it looks like the bug is fixed in Safari 11! \o/
