Remove select2 border on active of select element?

All we need is an easy explanation of the problem, so here it is.

I have gone through its css code but not able to find its actually property that is being applied on the main element.

i’m making some changes in select2 library so that i can use it in my way. i trapped in its CSS did not get from which property border displayed on active or focus on element.

Did not find any :active selector in css or I also checked it in js file not also there,while debugging not showing any css applied on that element.

Link for plunkr

image of element border.

enter image description here

How to solve :

I know you bored from this bug, So we are here to help you! Take a deep breath and look at the explanation of your problem. We have many solutions to this problem, But we recommend you to use the first method because it is tested & true method that will 100% work for you.

Method 1


span.select2-selection.select2-selection--single {
        outline: none;

updated plunkr

Note: Use and implement method 1 because this method fully tested our system.
Thank you 🙂

All methods was sourced from or, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply