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
Add the . flex-wrap class to your button group container. Show activity on this post. If, like me, you don't necessarily need the buttons to be in a group, you could also use the btn-toolbar class which defines flex-wrap: wrap by default.
Button groups allow multiple buttons to be stacked together on a single line. This is useful when you want to place items like alignment buttons together. You can add on optional JavaScript radio and checkbox style behavior with Bootstrap Button Plugin. This class is used for a basic button group.
Instead of applying button sizing classes to every button in a group, just add . btn-group-* to each . btn-group , including each one when nesting multiple groups.
btn-group class is used to create horizontally arranged button groups. Example: html.
Add the .flex-wrap class to your button group container.
<div class="btn-group flex-wrap" data-toggle="buttons">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With