button-group: no border-radius when containing only one button

[developit]

Placing a single <button> into a button-group causes it to render without any border-radius.

Here's my current fix:

.btn-group > .btn:first-child:last-child {
    border-radius: 4px;
}

[kevinmartin]

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

[kevinmartin]

Ill make a PR now

[developit]

Ah good call.