按钮组太长时间不包装

我有一个很长的按钮组:https://jsfiddle.net/cyu4bvak/

    
        ABCDEFGHIJKLMNOPQRSTUVWXYZ
    
    
        ABCDEFGHIJKLMNOPQRSTUVWXYZ
    
    
        ABCDEFGHIJKLMNOPQRSTUVWXYZ
    
    ...

无论视口的大小如何,它总是需要一条长行来导致滚动.

是否有可能使其包裹,以便在较小的视口上它将包裹更多的线而不会导致滚动？

如果没有哪个替代方案我必须获得预期的行为？

如果要将flex子项包装,请添加flex-wrap: wrap;到flex parent(.btn-group).