Search code examples
jquerycssjquery-select2-4jquery-select2

Change select 2 version 4 border color when it is opened


I have tried to change the border color of select 2 version 4 with when it is opened:

.select2-dropdown--above {
    border: 1px solid blue !important;;
    border-bottom: none !important;  

}

.select2-dropdown--below{
    border: 1px solid blue !important;;
    border-top: none !important;     

}

Code at: http://jsfiddle.net/7c0Lm033/

Here is what I get:

select 2

As you can see I can not change the color of select 2 head color. I could not find any unique selector which can change the marked color border.


Solution

  • You can add this to your css:

    span.select2-selection--multiple[aria-expanded=true] {
        border-color: blue !important;   
    }
    

    See fiddle