select ie css 관련 질문입니다. 채택완료
코드는 아래와 같습니다.
</strong></p>
<p><!DOCTYPE html></p>
<p><html lang="en"></p>
<p><head></p>
<p><meta charset="UTF-8"></p>
<p><meta name="viewport" content="width=device-width, initial-scale=1.0"></p>
<p><meta http-equiv="X-UA-Compatible" content="ie=edge"></p>
<p><title>Document</title></p>
<p> </p>
<p><style></p>
<p> </p>
<p>select {</p>
<p>height: 30px;</p>
<p>color: #000000;</p>
<p>border: 1px solid #cccccc;</p>
<p>border-radius: 3px;</p>
<p>-webkit-appearance: none; /* 화살표 없애기 for chrome*/</p>
<p>-moz-appearance: none; /* 화살표 없애기 for firefox*/</p>
<p>appearance: none; /* 화살표 없애기 공통*/</p>
<p>box-sizing: border-box;</p>
<p>outline: none;</p>
<p>background-color: #ffffff;</p>
<p>white-space: pre;</p>
<p>-webkit-rtl-ordering: logical;</p>
<p>cursor: default;</p>
<p>}</p>
<p>select::-ms-expand {</p>
<p>display: none; /* 화살표 없애기 for IE10, 11*/</p>
<p>}</p>
<p>:root select{padding:0 0 0 7px}</p>
<p>
</p>
<p>select {</p>
<p>top:0;bottom:0;right:0;width:27px;background:url(/images/auction/select_white.gif) no-repeat 100% 0;content:""</p>
<p>}</p>
<p>
</p>
<p>select {</p>
<p>border-radius: 0px;</p>
<p>border-color: rgb(169, 169, 169);</p>
<p>}</p>
<p>
</p>
<p>.styled {</p>
<p>width:70px;</p>
<p>}</p>
<p>
</p>
<p></style></p>
<p> </p>
<p></head></p>
<p><body></p>
<p> </p>
<p><select id="color" title="select color" class="styled"></p>
<p><option selected="selected">color</option></p>
<p><option>red</option></p>
<p><option>blue</option></p>
<p><option>yellow</option></p>
<p><option>black</option></p>
<p></select></p>
<p>
</p>
<p></body></p>
<p></html></p>
<p><strong>
ie9, 크롬, 파이어폭스 같은형태로 보입니다.
그런데
ie에서 셀렉트 하면 파란색으로 백그라운드가 생김니다.
다른브라우저에서는 파란색이 없습니다.
ie 에서 선택후 파란색이 안보이게 하는 방법이 있나요?
조언 부탁드립니다.
답변 1개
답변을 작성하려면 로그인이 필요합니다.
로그인