Material Outline 2.0 TextBox


Topic: Material Outline 2.0 TextBox

Aroquiassamy LA ROZE pro premium asked a year ago

Hi @Damian,

In Material 2.0 text-field/Input How to place the ICON inside the text-boxIn this Icon is outside the text-box But Instead I want to place it inside the textbox? can u guide me?


Damian Gemza staff answered a year ago

Dear La Roze,

Please check the below code.

.html:

<div class="md-form md-outline">
        <mdb-icon fas icon="envelope" style="position: absolute; right: 10px"></mdb-icon>
        <input type="text" id="inputIconEx1" class="form-control" mdbInput>
        <label for="inputIconEx1">E-mail address</label>
        <small id="emailHelp2" class="form-text text-muted">We'll never share your email with anyone.</small>
      </div>

Best Regards,

Damian


Please insert min. 20 characters.
Status

Resolved

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