Open developit opened 8 years ago
Or change:
> .btn:first-child {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
> .btn:last-child {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
> .btn:not(:first-child):not(:last-child) {
border-radius: 0;
}
to:
> .btn:not(:last-child) {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
}
> .btn:not(:first-child) {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
}
Also has the added benefit of being 2 selectors, not 3.
Pen with updated code: http://codepen.io/KevinMartin/pen/KdZPLJ
Ill make a PR now
Ah good call.
Placing a single
<button>
into abutton-group
causes it to render without any border-radius.Here's my current fix: