Font-awesome 5 showing white box on pseudo elements?

Asked Apr 21 '18 at 11:26

Active Apr 21 '18 at 11:39

Viewed 210 times

I am trying to use the font-awesome 5 on "li" element and it is showing the logo with the white box.

HTML:

  <div class="form-action">
      <ul class="select-bar">
          <li class="checkIn">
              <input type="text" id="datepicker">
          </li>
      </ul>
  </div>

CSS:

.checkIn input{
    width:170px;
    height:42px;
    padding:0px 0px 0px 40px;
}
.form-action .checkIn:before{
    content: "\f073";
    font-family: "Font Awesome 5 Regular";
    font-weight: 900;
    color: #777;
}

edited Apr 21 '18 at 11:39

Temani Afif

245,468
26
309
415

asked Apr 21 '18 at 11:26

Unity Hour

css or JS version ? – Temani Afif Apr 21 '18 at 11:34
@Temani font-awesome 5.0.10 – Unity Hour Apr 21 '18 at 11:35
I know the version, but are you using the JS or the CSS ? – Temani Afif Apr 21 '18 at 11:36
@Temani CDN js. – Unity Hour Apr 21 '18 at 11:36
so check the duplicate question and you will find the reason ;) [read both answers] – Temani Afif Apr 21 '18 at 11:37
@Temani can you give me the link to question – Unity Hour Apr 21 '18 at 11:38
it's on the top of this question, refresh the page – Temani Afif Apr 21 '18 at 11:38

Font-awesome 5 showing white box on pseudo elements?

0 Answers0