input type="hidden" causes border-radius issues in form.btn-group > .btn
Created by: tomhv
- Browser: Chrome version 40.0.2214.91 m
- Bootstrap: 3.3.2
- Expected: 4px border-radius on all four corners of
- Got: 4px border-radius on left; 0px border-radius on right
- JSFiddle: http://jsfiddle.net/mqov56r8/
<div class="btn-group" role="group" aria-label="...">
<form class="btn-group">
<button type="button" class="btn btn-default">Right</button>
<input type="hidden" name="_method" value="put" />
</form>
</div>
The rule in question seems to be:
.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
Changing the selector to the following fixes this issue, but may cause issues elsewhere:
.btn-group>.btn:first-child:not(:last-of-type):not(.dropdown-toggle)
Cheers,
Tom