I’ve written a small web-app using the select2 component. It’s mostly going to be used on mobile phones.
It’s being used to send scores in a card-tournament to a web-server. Just use the default values and press the submit button, if you want to try it: https://stillinglhombre.dk/kampseddel/
I haven’t changed much of the default behaviour, but I would like the font+size used in the dropdown-texts to be the same as the one that ends up in the select-box after choosing a value.
So, how do i achieve this?
I looked around, but the interior of the select2 system is not documented very well, I think
Some suggestions are here, using css to change the font etc:
https://stackoverflow.com/questions/34299971/change-default-font-of-select2?rq=1
But it all seems not really to work
Where can I find PROPER documentation on this kind of stuff?
Hans Otto Lunde, Denmark
The internal structure of the Select2 widget components are not formally documented anywhere. You can use your browser’s Inspect Element command to look at the HTML elements that make up the widget, and create CSS rules to target those elements.
Alternatively, you can use a custom render template to output the items in the dropdown with a CSS class you control; then you can target that class with your own CSS rule.
Hi John.
Thanks for your reply!
I’ll have a look at it with the developer tool, as you mentioned.
And figure it out.
1 Like