How to Override the css style for option tag in dropdown using jQuery?

Question

I have a dropdown where i have applied a class name "customDropDown" in which height has been set as "22px" and line-height as "22px" for each options in the dropdown. Issue is for there is one option which occupies space of two lines so it is overriding with next option. Is there any way to override the css in jQuery/javascript for that specific option alone to change the height as "44px" when the length of the option text is more than 25.

Answer 1

you can give a class to the option to which you want to change the height and include the following in your jquery code

$('.myClass').height(44);

It is recommended not to use any height for the options.instead use padding .

Answer 2

您可以尝试not to固定高度，而宁愿给选项元素添加填充，这会使它变得流畅。

Answer 3

Thanks everyone for the quick reply. I changed the height to auto. Issue resolved. Thanks again.