make btn-group responsive

Question

I have a very long list of buttons and I need to group them, but also display them nicely. And right now, The design doesn't split in rows. I have bootstrap 4

<div class="btn-group" data-toggle="buttons">
          <label class="btn btn-primary">
            <input type="checkbox" name="bla" id="2" autocomplete="off" value="2" > bla bla
          </label>
          <label class="btn btn-primary">
            <input type="checkbox" name="bla2" id="2" autocomplete="off" value="2" > bla bla
          </label>
... (and so on)

Thanks

Answer 1

Add the .flex-wrap class to your button group container.

<div class="btn-group flex-wrap" data-toggle="buttons">