Bootstrap button sizes not working?
Bootstrap changed the names of their buttons from 2.x ➡ to 3.x
Version Comparison
| 2.x | 3.x | 4.x |
|------------|---------|---------|
| .btn-large | .btn-lg | .btn-lg |
| .btn-small | .btn-sm | .btn-sm |
| .btn-mini | .btn-xs | - |
Demo for Bootstrap 3
So your updated code should look like this:
<div class="btn-group">
<a class="btn btn-xs btn-success" href="#">Approve</a>
<a class="btn btn-xs btn-danger" href="#">Deny</a>
</div>
<br>
<div class="btn-group">
<a class="btn btn-sm btn-success" href="#">Approve</a>
<a class="btn btn-sm btn-danger" href="#">Deny</a>
</div>
<br>
<div class="btn-group">
<a class="btn btn-success" href="#">Approve</a>
<a class="btn btn-danger" href="#">Deny</a>
</div>
Demo in jsFiddle which will produce this:
Docs from various versions
- Bootstrap Buttons 2.x
- Bootstrap Buttons 3.x
- Bootstrap Buttons 4.x
- Migration Guide 2 ➡ 3
- Migration Guide 3 ➡ 4
(If someone came here wondering why btn-xs
or btn-group-xs
is not working in >= 4.0)
Change log from bootstrap 3.0 to 4.0:
Dropped the .btn-xs class entirely as .btn-sm is proportionally much smaller than v3’s.
...
Dropped the .btn-group-xs class entirely given removal of .btn-xs.
Source