I am using Twitter Bootstrap's btn-group. I want to make all buttons go rounded corners.
But i am getting something like this on applying border-radius: 25px; : 
What i want is :

Can someone please code me a Bootstrap btn-group with all buttons having rounded corners. Also i'm not sure if this is possible or not.
You should probably be applying the border-radius on each individual button instead of on the whole btn-group.
<div class="btn-group" role="group" aria-label="...">
<button type="button" class="btn btn-default btn-rounded">Left</button>
<button type="button" class="btn btn-default btn-rounded">Middle</button>
<button type="button" class="btn btn-default btn-rounded">Right</button>
</div>
...and then the CSS class
.btn-rounded {
border-radius: 25px;
}
This issue is still unsolved. @apertureless @badrihippo Could you please modify the pen : codepen.io/b0y/pen/OMgZyB
Jakub
Web Developer
Sure it's possible.
You are half way through this. Your problem is, that inside a button group, they have a selector for not(:first-child) and not(:last-child) . You need to overwrite this one, too.