It doesn't show me the icon, I added it font-weight
and font-family
so I don't know why it's not working, this is my code.
<div className="box">
<select className="select-css btn mr-2" onChange={ handleChange("category") }>
<option valu="All">Pick category</option>
{ categories.map((cat, i) => (<option key={i} value={cat._id} > {cat.name}
</option>))
}
</select>
</div>
my css
.box:before {
font-family: "Font Awesome 5 Free";
font-weight: 900;
content: '\f078';
display: block;
position: absolute;
top: 0;
left: 0;
width: 50px;
height: 50px;
color: #fff;
}
You have to change the
div
to aspan
since thefont Awesome
can't be applied to divI leave you the snippet with three examples