input-group buttons are misaligned
Created by: Alex-PK
When using this code in v4-alpha6:
<nav class="navbar bg-faded">
<form class="form-inline my-2">
<div class="input-group mx-2">
<span class="input-group-addon">Monitoring:</span>
<span class="input-group-btn">
<button class="btn btn-outline-primary" type="button">All</button>
</span>
<span class="input-group-btn">
<button class="btn btn-outline-success" type="button">Yes</button>
</span>
<span class="input-group-btn">
<button class="btn btn-outline-danger" type="button">No</button>
</span>
</div>
</form>
</nav>
I get this:
As you can see, the add-on buttons are overlapping by 2-3 pixels.
I tested it in both Firefox 44 and Chrome 59 on Ubuntu 17.04