CSS만 사용자 지정

Form 요소 스타일 초기화

select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
  border: 0;
  margin: 0;
  padding: 0;
  background: none transparent;
  vertical-align: middle;
  font-size: inherit;
  color: inherit;
  box-sizing: content-box;
}

IE10

Firefox25

Opera12.16

오버플로우로 얼렁뚱땅 넘어가다

태그 예

<div class="custom">
  <select name="options">
    <option value="option-1">Option</option>
  </select>  
</div>

CSS(필요한 부분만 발췌)

.custom {
  overflow: hidden; /* 伸ばした分を隠す */
}
.custom > select {
  width: 130%; /* UI分を伸ばす */
}

기타 방법

select {
  -moz-appearance: none;
  text-indent: 0.01px;
  text-overflow: '';
}

select::-ms-expand {
  display: none;
}

Codepen