Topic: Icon in front of a select

Richard free asked 4 years ago


I was wondering if it's possible to put an icon in front of a select like

  <div class="md-form">
    <i class="fas fa-envelope prefix white-text active"></i>
    <input type="email" id="form2" class="white-text form-control">
    <label for="form2" class="active">Adresse email</label>

  <select class="mdb-select md-form">
    <i class="fas fa-venus-mars prefix white-text"></i>
    <option value="" disabled selected>Choose your option</option>
    <option value="1">Homme</option>
    <option value="2">Femme</option>
  <label class="mdb-main-label white-text">Genre</label>


y2k_eclipse free answered 3 years ago

  <div class="col-md-11">
    <!-- Material input -->
    <select class="mdb-select md-form colorful-select dropdown-primary">
      <option value="1">Titular</option>
      <option value="2">Conyuge</option>
      <option value="3">Hija</option>
      <option value="4">Hijo</option>
      <option value="5">Madre</option>
    <label class="mdb-main-label">Condición</label>

Marcin Luczak staff commented 3 years ago

Hello y2k_eclipse,

Please tell me how can I help you. Does this chunk of code does not work for you? Have you initialized material select with $('.mdb-select').materialSelect(); ?

Please see my snippet:

Regards, Marcin

Mikołaj Smoleński staff answered 4 years ago

Thanks for your remarks. We'll consider such option.

Best regards

Please insert min. 20 characters.


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



Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.8.5
  • Device: Huawei nova
  • Browser: Chrome 75.0.3770.143
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No