0

I have created a dropdown button and added a font awesome icon, but it is using the unicode and it is not showing up, well it is but as a faint square.

I have search the internet for a solution and the research is stating that make sure the font awesome css style sheet is linked to my html file which it is :/

My HTML is:

<div class="language">
    <select>
      <option value="">English</option>
      <option value="">Deutsch</option>
    </select>
</div>

My Css code is:

.language {
  float: right;
  margin-top: -45px;
  padding-right: 25px;
}
.language select {
  width: 180px;
  border: none;
}
.language::before {
  content: "\f0ac"
}

Any help appreciated and thanks in advance

yunzen
  • 32,854
  • 11
  • 73
  • 106

1 Answers1

0

To use font-awesome icons without appropriate classes, you should also set font-family, for example if you are using Font Awesome 5 Free you should also set:

.language::before {
  font-family: "Font Awesome 5 Free";
  content: "\f0ac"
}

P.S. also make sure you have included font-awesome stylesheets

Arman P.
  • 4,314
  • 2
  • 29
  • 47