.button-group buttons do not wrap as expected with flexbox enabled

[johnbacon]

.button-group components without flexbox enabled: http://codepen.io/johnbacon/pen/ZBzXMr
.button-group components with flexbox enabled: http://codepen.io/johnbacon/pen/gLYGBa

This appears to be due to the following: https://github.com/zurb/foundation-sites/blob/b1d99bb184d2bb8fb1ed2951c3e5ab8fb4f3a9d9/scss/components/_button-group.scss#L39

nowrap is the default value of flex-wrap, so I do not believe this needs to be specified at all in _button-group.scss. However, changing that value to wrap produces the expected result (consistent with non-flexbox): http://codepen.io/johnbacon/pen/eBOGbr

[rafibomb]

Hmmm, adding

.button-group {
  flex-wrap: wrap;
}

Seems to do the trick as you said. This might be as simple as adding this property and value to the .button-group parent. Are you able to submit a PR for it? We'd merge it in.

[canterberrie]

Hey, this is going to be fixed in a PR for fixing button group spacing. You can see the commit here: 22f33f0#diff-d0689b3f481699857ae2680a820ff6aaR39

[glen-84]

@canterberrie Any news regarding this issue?

[IamManchanda]

@rafibomb what's the status of this branch
https://github.com/zurb/foundation-sites/compare/buttongroup-flex

[colin-marshall]

Paging @rafibomb

[DanielRuf]

Still not fixed. https://codepen.io/DanielRuf/pen/rNByzMo