How to adjust (max-height) on a specific Selec2 dropdown?

[j inch]

I'm in need of removing a .select dropdown CSS property (max-height).
_______________

I understand this can be done by adjusting the CSS like so:

.select2-container--classic .select2-results > .select2-results__options {
    max-height: none !important;
    overflow-y: none !important;
}

_______________

HOWEVER...This will change it for all .select2 containers.
How do I target a specific .select2 dropddown?

I've tried targeting the custom CSS class I used to initiate the select2 (.mySelect2) but this does not work:

.mySelect2 .select2-container--classic .select2-results > .select2-results__options {
    max-height: none !important;
    overflow-y: none !important;
}

Is there a solution to target this CSS only on what is needed?

Thanks
> j

[Mahesh Mullapudi]

try to find the id generated for that particular select plugin. Based on that you add the css property.

For ex:  

$(document).ready(function(){

    $('#S2id_abc').css('max-height', 'none !important');  //S2id_abc is just an example for the id. If you inspect you will get the exact being generated on your page.

});

[j inch]

Thanks Mahesh :) - I will plug this in and give it a go.

Is only way to edit these select2 drop-downs through javascript?

It looks like they add additional CSS classes to the drop down but only after it's initiated through javascript - so a straight forward CSS doesn't seem to have an effect. Regardless this is helpful info- much appreciated!

--
You received this message because you are subscribed to a topic in the Google Groups "select2" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/select2/vMmSpWMXWsY/unsubscribe.
To unsubscribe from this group and all its topics, send an email to select2+unsubscribe@googlegroups.com.
To post to this group, send email to sel...@googlegroups.com.
Visit this group at https://groups.google.com/group/select2.
For more options, visit https://groups.google.com/d/optout.