Customize select bottom border color on activate and focus


Topic: Customize select bottom border color on activate and focus

As226 asked 4 years ago

Hello I need help to customize my select bottom border when activated or focused. My select html :

<select class="mdb-select md-form mdb-select-dropdown" >
    <option value="" disabled selected>Choice</option>
    <option value="1">Option1</option>
    <option value="2">Option2</option>                          
</select>
<label class="mdb-main-label">Choice</label>

Help please

Regards


Krzysztof Wilk staff answered 4 years ago

Hi!

You can use these styles to achieve that

.select-wrapper input.active, .select-dropdown:focus{
  border-bottom: 1px solid red !important;
  box-shadow: 0 1px 0 0 red !important;
 }

Of course, you can change my color for every color you want.

Best regards


Please insert min. 20 characters.

FREE CONSULTATION

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

Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.19.1
  • Device: PC
  • Browser: Chrome
  • OS: W10
  • Provided sample code: No
  • Provided link: No
Tags