{% include head.html %}
{% include navbar.html %}To let the Select2 widget know if any elements are directly being appended, prepended or both in the context of a Bootstrap Input Group, add .select2-bootstrap-prepend
and/or .select2-bootstrap-append
to the .input-group
wrapper element to address Select2's corresponding border-radii.
The theme offers styles to display "small" and "large" Select2 widgets in Bootstrap Input Groups with Bootstrap Control Sizing classes applied (e. g. Select2 in .input-group.input-group-sm
or .input-group.input-group-lg
). You may also apply the Bootstrap Control Sizing classes directly to the .select2-container
to alter its appearance.
While .select2-container--bootstrap.input-sm
and .select2-container--bootstrap.input-lg
work as advertised, Select2 4 currently does not offer copying CSS classes from the original <select>
element in an easy way like version 3.x did.
Click the button for a demo setting the required classes on .select2-container--bootstrap
:
The theme's styles work in Bootstrap's Horizontal Forms and offers support for Horizontal Form Group Sizes, too.
Tests for Select2 widgets used in context with Bootstrap's Button Addons.
The theme applies Bootstrap's styles for disabled input elements and for disabled dropdown options to the Select2 widgets and its options. Also see Select2's documentation on its "Disabled mode".