CODEWITHSUNDEEP
node.jsvue.js
GuruVenkatesh R
GuruVenkatesh R

Reputation: 37

How to place a font-awesome icon into a select drop-down menu?

I have struggling to set a font-awesome icon in the select drop-down menu in vuejs. I have tried some ways like

<option selected value="fa fa-github"><i class="fab fa-github"> 
</i>Github</option>

But it didn't work. please help me to solve this issue.

Upvotes: 2

Views: 9075

Answers (1)

Joost K
Joost K

Reputation: 1116

You can't put an <i> tag inside an <select> you can use the unicode directly inside the select and set the font with css.

HTML:

<select>
  <option selected value="fa fa-github">Github &#xf09b;</option>
</select>

CSS:

select {
  font-family: 'Font Awesome\ 5 Brands' , 'arial'
}

Example on this jsfiddle(font awesome 5): https://jsfiddle.net/68avuypL/

Upvotes: 4

Related Questions