Replace Caret in Bootstrap Select Field


Topic: Replace Caret in Bootstrap Select Field

Paul King pro asked 6 years ago

Is there a way to replace the default Material Bootstrap Select Drop Down Caret? I'd like to replace it with something that looks a little nicer but all code within the html select is generated.

Any help would be appreciated.

This is the code I currently have for the select:

<select class="mdb-select" id="category" name="category">
<option value="" selected>Product Category</option>
<?php echo($selectCat); ?>
</select>



Piotr Glejzer staff commented 6 years ago

Hi,

Did you try to use class 'caret' to style that caret dropdown and load from php?

Best,

Piotr


Paul King pro commented 6 years ago

Hi,

I'm not sure what you mean. From what I can see this caret and the dropdown gets loaded via mdb javascript after the page has loaded.

Anything I do in css or php is ignored or overwritten by the javascript.

Unless I'm misunderstanding?

Thanks

Paul


Piotr Glejzer staff commented 6 years ago

Yea, I know that caret is styling in js. But did you try to use class 'caret', to style your carret in css with !important?

Like that?

https://mdbootstrap.com/snippets/jquery/piotr-glejzer/173545

Best,

Piotr

 
 
 

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Open

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.1.1
  • Device: Desktop
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: Yes
  • Provided link: No