title: Put a font-awesome icon inside an input tag
body: <p>I'm trying to put a Font-awesome icon inside an input tag.</p>
  <p>This is my <code>HTML</code> code:</p>
  <pre><code>&lt;div class=&quot;input-group&quot;&gt;
          &lt;input class=&quot;form-control&quot; type=&quot;password&quot; placeholder=&quot;Password&quot;&gt;
          &lt;span class=&quot;input-group-addon&quot;&gt;&lt;i class=&quot;fa fa-key fa-fw&quot;&gt;&lt;/i&gt;&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  <p>But that icon is bigger than input box as you can see in this picture:</p>
  <p><a href="https://i.stack.imgur.com/763qw.png" rel="noreferrer"><img src="https://i.stack.imgur.com/763qw.png" alt="enter image description here" /></a></p>
  <p>How can I fix the icon?</p>