Some Font Awesome icons are not working

Uzair Nadeem picture Uzair Nadeem · Jul 20, 2017 · Viewed 9.3k times · Source
<div class="col-md-12">
     <div style="margin-top: 5px">
          <label>
             <a href="#"><i class="fa fa-comments" aria-hidden="true"></i> 
                Chat with @Model.MemberFirstName</a>
          </label>
          <label>
             <a href="#"><i class="fa fa-user-plus" aria-hidden="true"></i> 
                Send Friend Request</a>
          </label>
     </div>
</div>

Writing this code, I am using 2 font awesome icons. My first icon is showing on my output screen but 2nd one is not showing. I have written same code for 2nd. I also try removing the first one, The second still not show. Here is the output atatched.

output screen

Answer

Hassan Imam picture Hassan Imam · Jul 20, 2017

font-awesome v4.0.0 doesn't contain fa-user-plus class. Use font-awesome v4.7.0

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<div class="col-md-12">
     <div style="margin-top: 5px">
          <label>
             <a href="#"><i class="fa fa-comments" aria-hidden="true"></i> 
                Chat with @Model.MemberFirstName</a>
          </label>
          <label>
             <a href="#"><i class="fa fa-user-plus" aria-hidden="true"></i> 
                Send Friend Request</a>
          </label>
     </div>
</div>