Bootstrap 4 如何控制引导btn组（flex wrap）中断到新行的位置？

假设您有一行多个按钮，是否可以控制“柔性包装”的包装方式？在下面的示例中，发生的第一次换行将最后一个按钮移动到一个新行，结果在顶部有7个按钮，在新添加的第二行有一个巨大的按钮，这不是很漂亮

是否有一种方法可以更均匀地拆分按钮，在下面的示例中，理想情况下，最初应该是4-4拆分

<div class="btn-group flex-wrap btn-group-toggle" data-toggle="buttons">
    <label class="btn btn-outline-primary">
        <input autocomplete="off" id="b1" name="options" type="radio">Button 1
    </label>
    <label class="btn btn-outline-primary">
        <input autocomplete="off" id="b2" name="options" type="radio">Button 2
    </label>
    <label class="btn btn-outline-primary">
        <input autocomplete="off" id="b3" name="options" type="radio">Button 3
    </label>
    <label class="btn btn-outline-primary">
        <input autocomplete="off" id="b4" name="options" type="radio">Button 4
    </label>
    <label class="btn btn-outline-primary">
        <input autocomplete="off" id="b5" name="options" type="radio">Button 5
    </label>
    <label class="btn btn-outline-primary">
        <input autocomplete="off" id="b6" name="options" type="radio">Button 6
    </label>
    <label class="btn btn-outline-primary">
        <input autocomplete="off" id="b7" name="options" type="radio">Button 7
    </label>
    <label class="btn btn-outline-primary">
        <input autocomplete="off" id="b8" name="options" type="radio">Button 8
    </label>
</div>

按钮1
按钮2
按钮3
按钮4
按钮5
按钮6
按钮7
按钮8