Awesome Font in select box

Navigation
0

I'm having trouble displaying some of the FontAwesome 'icones' as in the example, note that an icon is displayed but the second does not, and when I click the select box the first option also does not display the icon correctly. How can I correct such errors? 

select {
      -webkit-appearance: none;
      -moz-appearance: none;
      -o-appearance: none;
      -ms-appearance: none;
      appearance: none;
      font-family: "Font Awesome 5 Free", "Roboto";
      font-weight: 900;
      font-size: 15px;
      color: #727272;
      border: none;
      margin-right: 10px; }
<link href="https://use.fontawesome.com/releases/v5.0.6/css/all.css" rel="stylesheet">

<div class="lang">
  <select>
    <option value="1">Português &#xf078;</option>
    <option value="2">English</option>
  </select>

  <select>
    <option value="1">BRL &#xf17b;</option>
    <option value="2">USD</option>
  </select>
</div>
    
asked by anonymous 10.06.2018 / 23:49

1 answer

-1

You should put the icon in a proper tag so that it is displayed correctly. 

<select>
    <option value="1">BRL <i class="fa fa-arrow-down"></i></option>
    <option value="2">USD</option>
  </select>
    
13.06.2018 / 18:36
Error inserting image into folder Tkinter, how to use the same script in win and llinux without the window icon disturbing [duplicate]