CSSだけでセレクトボックスの装飾

select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
  border: 1px solid #ddd;
  width:100%;
  margin: 0;
  padding: 4px;
  background: none transparent;
  vertical-align: middle;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  /*box-sizing: content-box;*/
  box-sizing: fixed;
}

select { /*矢印を消す for Firefox*/
  -moz-appearance: none;
  text-indent: 0.01px;
  text-overflow: '';
}

select::-ms-expand { /*矢印を消す for IE*/
  display: none;
}