button size not respected when direct child of div with d-flex
Created by: jclijmans
When placing a button with size classes as direct child of a div with d-flex, size is not respected
<div class="d-flex flex-row">
<button type="button" class="m-2 btn btn-primary">Default</button>
<button type="button" class="m-2 btn btn-primary btn-sm">Small</button>
<button type="button" class="m-2 btn btn-primary btn-md">Medium</button>
<button type="button" class="m-2 btn btn-primary btn-lg">Large</button>
</div>
While
<div class="d-flex flex-row">
<div>
<button type="button" class="m-2 btn btn-primary">Default</button>
<button type="button" class="m-2 btn btn-primary btn-sm">Small</button>
<button type="button" class="m-2 btn btn-primary btn-md">Medium</button>
<button type="button" class="m-2 btn btn-primary btn-lg">Large</button>
</div>
</div>
Not sure if it's a bug, or more likely that I don't understand it properly.
- Bootstrap 5.1.0
- Operating system and version (Windows, macOS, Android, iOS) Windows 10 21H1
- Browser and version (Chrome, Firefox, Safari, Microsoft Edge, Opera, Android Browser) Microsoft Edge : Version 92.0.902.78 Chrome : Version 92.0.4515.159 Firefox : 91.0.2 (64-bit)