Bootstrap 3 button group: corner radius dissapears after a button is hidden
I have the following Bootstrap 3 button group:
I hide the first button using:
The result is that the first visible button doesn’t have corner radius:
I guess the BS says: first child of .btn-group has border-radius instead of first visible child of .btn-group has border-radius
Is there any way to fix this?
Note that I don’t want to remove the button but to hide it.
Given that you are already using jQuery, you could use the following to add a class to the first/last visible button elements.
You would then need to add the following styling:
!important is necessary to overwrite the default Bootstrap styling.
As an alternative, you could remove the first button element completely and then add it back in when necessary..
$("button:eq(0)").remove(); – (example)