Graphical issues with sizes under 50%


I am currently fitting select 2 into a form on a web page. While I was adjusting the size of the text box to match the other input fields I settled on “40” for the size of the select2 box. For some odd reason, this size makes the selection menu appear above the box rather than below, and it creates some odd behavior when the list of visible options enter and exit the dropdown menu. When I set the size to “50”, the select2 element seemed to work as desired. Is there a way to get the object to work properly at sizes under 50?


What method are you using to adjust the size of the Select2 text box? As far as I know, this is not a configuration option, and the only way to influence the width of the text box is to specify the size of the underlying HTML <select> (either in CSS or an inline style).

Can you put some sample code (e.g., the rendered HTML/JS sent to the browser from your app) on or so I can see the behavior you’re describing?


I think I seem to have fixed it, I had some other weird stuff going on and that was likely causing the visual issues