CSS inline svg background in select with firefox -
i building custom select tag inline svg background using -webkit-appearance: none in css.
http://jsfiddle.net/sucrenoir/yhr53/5/
select { font-size: 30px; border: 1px solid lightblue; border-radius: 10px; color: black; padding: 12px; width: 300px; -webkit-appearance: none; background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='50px' height='50px'><polyline points='46.139,15.518 25.166,36.49 4.193,15.519'/></svg>") right no-repeat; background-color: lightblue; background-transparency: 0.5; background-position: right 15px top 22px; background-size: 18px 18px; }
it not work in firefox (obviously).
what equivalent of -webkit-appearance: none in firefox work ?
thank in advance
unfortunately answer no @ moment.
according mdn doc, it's not recommended use it's buggy.
Comments
Post a Comment