I use Bootstrap-vue and I have a group of 2 radio buttons (b-form-radio-group) I'm trying to set each radio button to 50% width. I created the following code structure:
<b-row>
<b-col cols="12" sm="auto" class="text-center">
<b-form-group class="w-100">
<b-form-radio-group
button-variant="outline-primary"
buttons
class="d-flex flex-wrap"
></b-form-radio-group>
</b-form-group>
</b-col>
</b-row>
The classes d-flex and flex-wrap don't have an effect. And currently, I see the radio buttons like this:

How can I change each radio button's width to 50%, and in the end to see them like that (if possible without CSS styles):
