Utilizing the amazing Bootstrap-select jQuery plugin has brought two unexpected default styles to my selectboxes. Despite inserting the necessary CSS and JS files into my website, all select boxes are displaying with these peculiar default settings (without any additional attributes applied).
https://i.sstatic.net/fJmyP.png
Environment
- Wordpress: 5.2.2
- Theme: WP Bootstrap Starter
Two oddities :
- All of my select boxes have an unexpected bootstrap
btn-dangerclass instead of the expectedbtn-defaultclass. - Upon reaching a certain break point, the padding within the options disappears, causing them to be flush against the border.
Code for enqueuing javascript and css:
function my_scripts() {
wp_register_style( 'bootstrap-select-css-cdn', 'https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="274548485354535546570a54424b4dd445454744411aec1dbccfccac7ccc6d'>[email protected]</a>/dist/css/bootstrap-select.min.css' );
wp_enqueue_style('bootstrap-select-css-cdn');
wp_register_script( 'bootstrap-select-js-cdn', 'https://cdn.jsdelivr.net/npm/<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="395b56564d4a4d4b5849144a5c54555e444f5401565454134358">[email protected]</a>/dist/js/bootstrap-select.min.js', null, null, true );
wp_enqueue_script('bootstrap-select-js-cdn');
}
add_action('wp_enqueue_scripts', 'my_scripts');
To provide full context, here is the code for the select box:
<div class="form-group col-sm-3">
<label for='order'>Order:</label><br>
<select name='order' id='order' class="form-control">
<option value='ASC'>ASC</option>
<option value='DESC'>DESC</option>
</select>
</div>
Inspecting the markup in the browser reveals the following:
https://i.sstatic.net/RXyYc.png
Thus, two questions arise:
- Why are these unusual defaults occurring? It seems unlikely that this behavior is standard.
- How can this be corrected? How can I ensure that all select boxes throughout the site display as "btn-default" rather than "btn-danger," and how can the missing padding be added back for the disappearing options at the breakpoint?