JSFiddle - React, Tailwind, and code Playground

by sstur

HTML

<h1>How to remove the select arrow in Firefox</h1>
<select>
  <option>Firefox</option>
  <option>Chrome</option>
  <option>Internet Explorer</option>
  <option>Safari</option>
</select>

CSS

select {
  border: 1px solid #999;
  -moz-appearance: none;
  text-indent: 0.01px;
  text-overflow: '';
  background-position: right center;
  background-repeat: no-repeat;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAFCAYAAACJmvbYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAC9JREFUeNpi/P//PwMuwAIiGhoaMFQAxRiZYAx0CTADZCwM19fX/0fmM+KzEyDAAPPcIW8HBN5iAAAAAElFTkSuQmCC");
}